2

Tengo un formulario en html para editar o buscar datos en una sheet, todo funciona pero despues de dar clic al botón editar o cuando intento hacer dos búsquedas seguidas la página desaparece y tengo que recargar manualmente. Me gustaría saber como hacer que después de dar clic a editar el formulario o la pagina se recargue o algo parecido o si hay algún error en el código, dejo los códigos y un enlace al formulario espero me puedan ayudar gracias de antemano.

Formulario

https://script.google.com/macros/s/AKfycbxm0qAdCM1Ca1NO2FkGDcMlyGnvaYgUTPUwK_zLSnRlLYokI-XL/exec

INDEX.HTML

<script src="//code.jquery.com/jquery-1.10.2.js"></script>
<link rel="stylesheet" href="https://ssl.gstatic.com/docs/script/css/add-ons.css">


<script>

  function buscaInformacion(){
   google.script.run.withSuccessHandler(getLlegada).getLlegadaSS(document.forms[0]);
   google.script.run.withSuccessHandler(getSalida).getSalidaSS(document.forms[0]);
 }

  function editaInformacion(){
   google.script.run.setLlegadaSS(document.forms[0]);
   google.script.run.setSalidaSS(document.forms[0]);
 }

  function getLlegada(llegada){
   var txtLlegada = document.getElementById('llegada');
   txtLlegada.value = llegada;
 }

  function getSalida(salida){
   var txtSalida = document.getElementById('salida');
   txtSalida.value = salida;
 }

  $(function() {
   $( "#buscar" ).click(buscaInformacion);
   $( "#editar" ).click(editaInformacion);
 });

 </script>

<html>
<body bgcolor="e3e5e8">

<br><br>

<div align="center" >

<form id="datosPersona" name="datosPersona" autocomplete="off">
<input type="text" id="id" name="id" autofocus="autofocus" required>

<br><br><br>

<label for="llegada">Llegada a cliente</label>
<input type="date" id="llegada" name="llegada" required>

<br><br>

<label for="salida">Salida de cliente</label>
<input type="date" id="salida" name="salida" >

<br><br><br>
<button id="buscar">Buscar</button>
<button id="editar">Editar</button>

</form>
</div>
</body>
</html>

MAIN.GS

// Llamar al HTML

function doGet() {
    return HtmlService.createHtmlOutputFromFile('Index');
}


// Buscar y regresar el numero de fila

function buscaReturnRow(sId){

   var hojaCalculo = SpreadsheetApp.openById("1eQBeHPVHjbiDVPRHC8rqRy1WvXC7HYPpxIwUcpylUDw");
   var hojaDatos = hojaCalculo.getSheetByName('BD');
   var numColumns = hojaDatos.getLastColumn();
   var ultimaFila = hojaDatos.getLastRow();
   var sw = 0;
   var row = hojaDatos.getRange(1, 1, ultimaFila, numColumns).getValues();

        for (var i = 1; i < row.length; i++) {   
           for (var col = 0; col < row[i].length; col++) {
                  var id = row[i][2].toString();
                  if (sId == id){                     
                     var indice = i+1;
                     sw = 1;
                  }
           }
        }  
  if (sw == 1){
     return indice;
  }
}



// Buscar y regresar la ia informacion de una fila y columna

  function buscaEnSheet(sId, columna){

   var hojaCalculo = SpreadsheetApp.openById("1eQBeHPVHjbiDVPRHC8rqRy1WvXC7HYPpxIwUcpylUDw");
   var hojaDatos = hojaCalculo.getSheetByName('BD');
   var numColumns = hojaDatos.getLastColumn();
   var ultimaFila = hojaDatos.getLastRow();
   var sw = 0;
   var row = hojaDatos.getRange(1, 1, ultimaFila, numColumns).getValues();

        for (var i = 1; i < row.length; i++) {   
           for (var col = 0; col < row[i].length; col++) {
                  var id = row[i][2].toString();
                  if (sId == id){                     
                     var indice = i+1;
                     sw = 1;
                  }
           }
        }  
  if (sw == 1){
    var info = hojaDatos.getRange(indice, columna).getValue();
    return info;
  }
}



// Buscar y regresar el valor de llegada

  function getLlegadaSS(e){
  var sId = e.id;
  return  buscaEnSheet(sId, 5);
}


// Buscar y regresar el valor de salida

  function getSalidaSS(e){
  var sId = e.id;
  return  buscaEnSheet(sId, 6);
}



// Editar

function setLlegadaSS(e){
  var sId = e.id;
  var sLlegada = e.llegada;
  var row =  buscaReturnRow(sId);
  var hojaCalculo = SpreadsheetApp.openById("1eQBeHPVHjbiDVPRHC8rqRy1WvXC7HYPpxIwUcpylUDw");
  var hojaDatos = hojaCalculo.getSheetByName('BD');
  hojaDatos.getRange(row, 5).setValue(sLlegada);
}

function setSalidaSS(e){
  var sId = e.id;
  var sSalida = e.salida;
  var row =  buscaReturnRow(sId);
  var hojaCalculo = SpreadsheetApp.openById("1eQBeHPVHjbiDVPRHC8rqRy1WvXC7HYPpxIwUcpylUDw");
  var hojaDatos = hojaCalculo.getSheetByName('BD');
  hojaDatos.getRange(row, 6).setValue(sSalida);
}
2

1 respuesta 1

1

Si no lo has hecho aún es conveniente que revises las guías en la documentación oficial. Aunque están en inglés, tienen varios ejemplos de código que te pueden servir. En este caso en particular revisa

https://developers.google.com/apps-script/guides/html/communication#forms

Del código de index.html cabe destacar

// Prevent forms from submitting.
function preventFormSubmit() {
  var forms = document.querySelectorAll('form');
  for (var i = 0; i < forms.length; i++) {
    forms[i].addEventListener('submit', function(event) {
      event.preventDefault();
    });
  }
}
window.addEventListener('load', preventFormSubmit);

A su vez donde podemos señalar que el truco está en

event.preventDefault()

¿No es la respuesta que buscas? Examina otras preguntas con la etiqueta o formula tu propia pregunta.