Los resultados de Java Script no se muestran en HTML
Escribí un código GAS para verificar si el empleado está dentro o no (extrayendo datos de las hojas de Google). El registro de la consola me da la respuesta correcta, pero cuando hago clic en el botón, la respuesta no aparece en la parte frontal. ¿Me pueden ayudar a solucionar problemas en los que me equivoqué?
<div>
<script>
function onStatus(notify) {
var employee = "John Peter";
var ss = SpreadsheetApp.getActiveSpreadsheet();
var mainSheet = ss.getSheetByName("MAIN");
var data = mainSheet.getDataRange().getValues();
for (var j = 0; j < data.length; j++){
var row = data[j];
var mainSheet2 = row[4];
var mainSheet3 = row[0];
var status = (mainSheet2 =="IN" && mainSheet3 == employee) ;
if (status == true){
var notify = employee +" You Are In"
return notify;
}
}
document.getElementById('status').innerHTML= notify;
}
</script>
<button onclick="onStatus()">Check Status</button>
<font color='Green' id="status" ></font>
</div>
Respuestas
Google proporciona una muy buena guía de comunicación de cliente a servidor que le sugiero que lea para comprender mejor cómo funciona.
No puede poner código de secuencia de comandos de aplicaciones (por ejemplo SpreadsheetApp.getActiveSpreadsheet()) en sus secuencias de comandos frontend. Ese código debe ser ejecutado por el servidor de secuencias de comandos de aplicaciones en el backend y luego lo llamará mediante una google.script.runllamada.
Code.gs
function doGet(e) {
return HtmlService.createHtmlOutputFromFile('Index');
}
function checkStatus() {
var employee = "John Peter";
var ss = SpreadsheetApp.getActiveSpreadsheet();
var mainSheet = ss.getSheetByName("MAIN");
var data = mainSheet.getDataRange().getValues();
for (var j = 0; j < data.length; j++){
var row = data[j];
var mainSheet2 = row[4];
var mainSheet3 = row[0];
var status = (mainSheet2 =="IN" && mainSheet3 == employee) ;
if (status == true){
return employee + " You Are In";
}
}
}
Index.html
<!DOCTYPE html>
<html>
<head>
<base target="_top">
</head>
<body>
<div>
<button onclick="onStatus()">Check Status</button>
<font color='Green' id="status" ></font>
</div>
<script>
function onStatus() {
google.script.run
.withSuccessHandler(updateStatus) // Send the backend result to updateStatus()
.checkStatus(); // Call the backend function
}
function updateStatus(notify) {
document.getElementById('status').innerHTML= notify;
}
</script>
</body>
</html>