Estoy dando mis primeros pasos en programación, por lo que me di a la tarea de recopilar muchos programas de la web para intentar hacer una aplicación web en google a partir de un googlesheet como base de datos, estoy siguiendo los pasos para poder buscar, guardar y editar la información de los clientes a través de la aplicación.
El HTML me funciona en la parte de visualización, pero en funcionalidad no hace nada, o sea no guarda, busca o edita informacion alguna en el googlesheet. Por eso estoy pidiendo por favor me ayuden a ver que estoy haciendo errado.
Este es el código que hice:
Código Gs.
//********************************Llama HTML******************************
function doGet(e) {
Logger.log(Utilities.jsonStringify(e))
if (!e.parameter.page){
return HtmlService.createTemplateFromFile('Index').evaluate()
}
var template = HtmlService.createTemplateFromFile(e.parameter.page)
template.action = ScriptApp.getService().getUrl();
return template.evaluate();
}
//********************************Busca en la hoja******************************************
function buscaReturnRow(sId){
var hojaCalculo = SpreadsheetApp.openById("12vFlDaG9ZGGa90EeyOLGyzO4xaxYs8lucgS-CdgJJsA");
var hojaDatos = hojaCalculo.getSheetByName('Clientes');
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;
}
}
//*****************Busca informacion y retorna a columna especifica****************************
function buscaEnSheet(sId, columna){
var hojaCalculo = SpreadsheetApp.openById("12vFlDaG9ZGGa90EeyOLGyzO4xaxYs8lucgS-CdgJJsA");
var hojaDatos = hojaCalculo.getSheetByName('Clientes');
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;
}
}
//**************************guarda datos en la hoja*****************************
function procesaFormClientes(e){
var sEmpresa = e.empresa;
var sContato1 = e.contato1;
var hojaCalculo = SpreadsheetApp.openById("12vFlDaG9ZGGa90EeyOLGyzO4xaxYs8lucgS-CdgJJsA");
var hojaDatos = hojaCalculo.getSheetByName('Clientes');
var ultimaFila = hojaDatos.getLastRow();
hojaDatos.getRange(ultimaFila+1, 1).setValue(sEmpresa);
hojaDatos.getRange(ultimaFila+1, 2).setValue(sContato1);
}
//********************************Funcion devuelve datos*********************************
// Buscar y regresar el valor de Empresa
function getEmpresaSS(e){
var sId = e.id;
return buscaEnSheet(sId, 1);
}
// Buscar y regresar el valor de Contato1
function getContato1SS(e){
var sId = e.id;
return buscaEnSheet(sId, 2);
}
//Editar informacao Empresa
function SetEmpresaSS(e){
var sEmpresa = e.empresa;
var row = buscaReturnRow(sId);
var hojaCalculo = SpreadsheetApp.openById("12vFlDaG9ZGGa90EeyOLGyzO4xaxYs8lucgS-CdgJJsA");
var hojaDatos = hojaCalculo.getSheetByName('Clientes');
hojaDatos.getRange(row, 1).setValue(sEmpresa);
}
function SetContato1SS(e){
var sContato1 = e.contato1;
var row = buscaReturnRow(sId);
var hojaCalculo = SpreadsheetApp.openById("12vFlDaG9ZGGa90EeyOLGyzO4xaxYs8lucgS-CdgJJsA");
var hojaDatos = hojaCalculo.getSheetByName('Clientes');
hojaDatos.getRange(row, 2).setValue(sContato1);
}
<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 cerrarVentanaModal(){
google.script.host.close();
}
function procesaFormulario(){
google.script.run.procesaFormClientes(document.forms[0]);
}
function buscaInformacion(){
google.script.run.withSuccessHandler(getEmpresa).getLEmpresaSS(document.forms[0]);
google.script.run.withSuccessHandler(getContato1).getContato1SS(document.forms[0]);
}
}
function editaInformacion(){
google.script.run.setEmpresaSS(document.forms[0]);
google.script.run.setContato1SS(document.forms[0]);
}
function getEmpresa(empresa){
var txtEmpresa = document.getElementById('Empresa');
txtEmpresa.value = empresa;
}
function getContato1(contato1){
$( "#contato1" ).val(contato1);
}
$(function() {
$( "#cancelar" ).click(cerrarVentanaModal);
$( "#salvar" ).click(procesaFormulario);
$( "#editar" ).click(editaInformacion);
$( "#buscar" ).click(buscaInformacion);
});
google.setOnLoadCallback(mostrarAcceso);
</script>
<html>
<head>
<base target="_top">
</head>
<br/>
<a href='https://photos.google.com/share/AF1QipO6JWoPTfg9brMrEbg7JpQatE45rh_NDKBjrPFyJXv0wbsKrrLts_NeXdcW5JYfMw?key=YUhWVExtYlpJLVNHTHg4czRVQU51ZXBIY3VBTDRn&source=ctrlq.org'><img src='https://lh3.googleusercontent.com/Di9aP7ey0YLpV_HmoYR346MnhDmL41aIGexm0rTIJ6KZfcKZCZjDp4nCZfpCPpd0UzEo9DsbXQrT_QIXd-WeDAoH5rpr70SpNS8e6lHAPg8YSXgihR_pqe4curaIOuEHJhvA7qIGeNg=w200' /></a>
<br/>
<div id="wb_Form1" style="position:absolute;width:1149px;height:651px;">
<form id="datoscliente" name="datosCliente">
<br>
<label for="Empresa" id="Label20" style="position:absolute;left:10px;top:15px;width:139px;height:16px;line-height:16px;z-index:0;">Empresa</label>
<input id="empresa" style="position:absolute;left:84px;top:15px;width:417px;height:26px;z-index:1;" name="empresa" >
<br>
<label for="Contato1" id="Label3" style="position:absolute;left:10px;top:63px;width:57px;height:16px;line-height:16px;z-index:2;">Contato1</label>
<input type="text" id="contato1" style="position:absolute;left:84px;top:62px;width:190px;height:30px;z-index:3;" name="contato1" >
<br>
<br><br><br>
<button id="salvar" Class="action">Salvar</button>
<button id="buscar" Class="action">Procurar</button>
<button id="editar" Class="action">Editar</button>
<button id="cancelar"class="create">Cancelar</button>
</form>
</div>
</html>