1

I am using Google Scripts App, and I need to send the value of a batch of HTML Inputs to a Google Spreadsheet, on specific cells (row and column). However, the code I used, takes forever, and when it finish, not all inputs are passed to the Spreadsheet. Do to company restrictions (policies on software), I can only use pure JavaScript. This HTML page, is just a part of an App whit others pages, so using Google Forms, can’t be an option. Is there a better way to send the inputs values to Google Spreadsheet faster and without skipping inputs? I know that using too much “google.script.run”, slows down the process heavily, but can’t figure out another way. I am new at this, so don’t expect I know too much, just the barely basics. Because of STACKOVERFLOW limitation, I limited the code to only three MODULES and 20 inputs per module (but there are four MODULES, with 30 inputs per module, as you can see it in the picture). What alternative would you all recommend? I am sharing the Code.gs and HTML scripts. Thanks.

Image of Spreadsheet and Full HTML page

code.gs

function doGet() {
  var template = HtmlService.createTemplateFromFile("HTML_start_page")
  return template.evaluate().setSandboxMode(HtmlService.SandboxMode.IFRAME);
  return HtmlService.createHtmlOutputFromFile('HTML_start_page');
}
var ss = SpreadsheetApp.openByUrl("YOUR_GOOGLE_SPREADSHEET_URL_HERE");
var sheet_Balance = ss.getSheetByName("Page_1");

function getValuesFromForm_Balance_001A(id2000_01AA){  
   sheet_Balance.getRange(267,6).setValue(id2000_01AA);
}    
function getValuesFromForm_Balance_002A(id2000_02AA){    
   sheet_Balance.getRange(268,6).setValue(id2000_02AA);
}
function getValuesFromForm_Balance_003A(id2000_03AA){    
   sheet_Balance.getRange(269,6).setValue(id2000_03AA);
}  
function getValuesFromForm_Balance_004A(id2000_04AA){    
   sheet_Balance.getRange(270,6).setValue(id2000_04AA);
}  
function getValuesFromForm_Balance_005A(id2000_05AA){    
   sheet_Balance.getRange(271,6).setValue(id2000_05AA);
}
function getValuesFromForm_Balance_006A(id1000_01AA){  
   sheet_Balance.getRange(272,6).setValue(id1000_01AA);
}    
function getValuesFromForm_Balance_007A(id1000_02AA){    
   sheet_Balance.getRange(273,6).setValue(id1000_02AA);
}
function getValuesFromForm_Balance_008A(id1000_03AA){    
   sheet_Balance.getRange(274,6).setValue(id1000_03AA);
}  
function getValuesFromForm_Balance_009A(id1000_04AA){    
   sheet_Balance.getRange(275,6).setValue(id1000_04AA);
}  
function getValuesFromForm_Balance_010A(id1000_05AA){    
   sheet_Balance.getRange(276,6).setValue(id1000_05AA);
}
function getValuesFromForm_Balance_011A(id500_01AA){  
   sheet_Balance.getRange(277,6).setValue(id500_01AA);
}    
function getValuesFromForm_Balance_012A(id500_02AA){    
   sheet_Balance.getRange(278,6).setValue(id500_02AA);
}
function getValuesFromForm_Balance_013A(id500_03AA){    
   sheet_Balance.getRange(279,6).setValue(id500_03AA);
}  
function getValuesFromForm_Balance_014A(id500_04AA){    
   sheet_Balance.getRange(280,6).setValue(id500_04AA);
}  
function getValuesFromForm_Balance_015A(id500_05AA){    
   sheet_Balance.getRange(281,6).setValue(id500_05AA);
} 
function getValuesFromForm_Balance_016A(id200_01AA){  
   sheet_Balance.getRange(282,6).setValue(id200_01AA);
}    
function getValuesFromForm_Balance_017A(id200_02AA){    
   sheet_Balance.getRange(283,6).setValue(id200_02AA);
}
function getValuesFromForm_Balance_018A(id200_03AA){    
   sheet_Balance.getRange(284,6).setValue(id200_03AA);
}  
function getValuesFromForm_Balance_019A(id200_04AA){    
   sheet_Balance.getRange(285,6).setValue(id200_04AA);
}  
function getValuesFromForm_Balance_020A(id200_05AA){    
   sheet_Balance.getRange(286,6).setValue(id200_05AA);
} 
function getValuesFromForm_Balance_001B(id2000_01BB){  
   sheet_Balance.getRange(267,7).setValue(id2000_01BB);
}    
function getValuesFromForm_Balance_002B(id2000_02BB){    
   sheet_Balance.getRange(268,7).setValue(id2000_02BB);
}
function getValuesFromForm_Balance_003B(id2000_03BB){    
   sheet_Balance.getRange(269,7).setValue(id2000_03BB);
}  
function getValuesFromForm_Balance_004B(id2000_04BB){    
   sheet_Balance.getRange(270,7).setValue(id2000_04BB);
}  
function getValuesFromForm_Balance_005B(id2000_05BB){    
   sheet_Balance.getRange(271,7).setValue(id2000_05BB);
}
function getValuesFromForm_Balance_006B(id1000_01BB){  
   sheet_Balance.getRange(272,7).setValue(id1000_01BB);
}    
function getValuesFromForm_Balance_007B(id1000_02BB){    
   sheet_Balance.getRange(273,7).setValue(id1000_02BB);
}
function getValuesFromForm_Balance_008B(id1000_03BB){    
   sheet_Balance.getRange(274,7).setValue(id1000_03BB);
}  
function getValuesFromForm_Balance_009B(id1000_04BB){    
   sheet_Balance.getRange(275,7).setValue(id1000_04BB);
}  
function getValuesFromForm_Balance_010B(id1000_05BB){    
   sheet_Balance.getRange(276,7).setValue(id1000_05BB);
}
function getValuesFromForm_Balance_011B(id500_01BB){  
   sheet_Balance.getRange(277,7).setValue(id500_01BB);
}    
function getValuesFromForm_Balance_012B(id500_02BB){    
   sheet_Balance.getRange(278,7).setValue(id500_02BB);
}
function getValuesFromForm_Balance_013B(id500_03BB){    
   sheet_Balance.getRange(279,7).setValue(id500_03BB);
}  
function getValuesFromForm_Balance_014B(id500_04BB){    
   sheet_Balance.getRange(280,7).setValue(id500_04BB);
}  
function getValuesFromForm_Balance_015B(id500_05BB){    
   sheet_Balance.getRange(281,7).setValue(id500_05BB);
} 
function getValuesFromForm_Balance_016B(id200_01BB){  
   sheet_Balance.getRange(282,7).setValue(id200_01BB);
}    
function getValuesFromForm_Balance_017B(id200_02BB){    
   sheet_Balance.getRange(283,7).setValue(id200_02BB);
}
function getValuesFromForm_Balance_018B(id200_03BB){    
   sheet_Balance.getRange(284,7).setValue(id200_03BB);
}  
function getValuesFromForm_Balance_019B(id200_04BB){    
   sheet_Balance.getRange(285,7).setValue(id200_04BB);
}  
function getValuesFromForm_Balance_020B(id200_05BB){    
   sheet_Balance.getRange(286,7).setValue(id200_05BB);
} 
function getValuesFromForm_Balance_001C(id2000_01CC){  
   sheet_Balance.getRange(267,8).setValue(id2000_01CC);
}    
function getValuesFromForm_Balance_002C(id2000_02CC){    
   sheet_Balance.getRange(268,8).setValue(id2000_02CC);
}
function getValuesFromForm_Balance_003C(id2000_03CC){    
   sheet_Balance.getRange(269,8).setValue(id2000_03CC);
}  
function getValuesFromForm_Balance_004C(id2000_04CC){    
   sheet_Balance.getRange(270,8).setValue(id2000_04CC);
}  
function getValuesFromForm_Balance_005C(id2000_05CC){    
   sheet_Balance.getRange(271,8).setValue(id2000_05CC);
}
function getValuesFromForm_Balance_006C(id1000_01CC){  
   sheet_Balance.getRange(272,8).setValue(id1000_01CC);
}    
function getValuesFromForm_Balance_007C(id1000_02CC){    
   sheet_Balance.getRange(273,8).setValue(id1000_02CC);
}
function getValuesFromForm_Balance_008C(id1000_03CC){    
   sheet_Balance.getRange(274,8).setValue(id1000_03CC);
}  
function getValuesFromForm_Balance_009C(id1000_04CC){    
   sheet_Balance.getRange(275,8).setValue(id1000_04CC);
}  
function getValuesFromForm_Balance_010C(id1000_05CC){    
   sheet_Balance.getRange(276,8).setValue(id1000_05CC);
}
function getValuesFromForm_Balance_011C(id500_01CC){  
   sheet_Balance.getRange(277,8).setValue(id500_01CC);
}    
function getValuesFromForm_Balance_012C(id500_02CC){    
   sheet_Balance.getRange(278,8).setValue(id500_02CC);
}
function getValuesFromForm_Balance_013C(id500_03CC){    
   sheet_Balance.getRange(279,8).setValue(id500_03CC);
}  
function getValuesFromForm_Balance_014C(id500_04CC){    
   sheet_Balance.getRange(280,8).setValue(id500_04CC);
}  
function getValuesFromForm_Balance_015C(id500_05CC){    
   sheet_Balance.getRange(281,8).setValue(id500_05CC);
} 
function getValuesFromForm_Balance_016C(id200_01CC){  
   sheet_Balance.getRange(282,8).setValue(id200_01CC);
}    
function getValuesFromForm_Balance_017C(id200_02CC){    
   sheet_Balance.getRange(283,8).setValue(id200_02CC);
}
function getValuesFromForm_Balance_018C(id200_03CC){    
   sheet_Balance.getRange(284,8).setValue(id200_03CC);
}  
function getValuesFromForm_Balance_019C(id200_04CC){    
   sheet_Balance.getRange(285,8).setValue(id200_04CC);
}  
function getValuesFromForm_Balance_020C(id200_05CC){    
   sheet_Balance.getRange(286,8).setValue(id200_05CC);
}

html

<!DOCTYPE html>
<html>
<body>  
<!-- MODULE I ---->
<div>
<form style="border:0px solid #1f3f79; float:left; padding-left: 5px;">
<table>
<div>
<tr>
<tr>
<td>
<label>MODULE I</label>
<br>
<input type="text" value="0"  id="id2000_01AA">
</td> 
</tr>
<tr>
<td>
<input type="text" value="0"  id="id2000_02AA">
</td>
</tr> 
<tr>
<td>    
<input type="text" value="0"  id="id2000_03AA"> 
</td>
</tr> 
<tr>
<td> 
<input type="text" value="0"  id="id2000_04AA">
</td>
</tr> 
<tr>
<td> 
<input type="text" value="0"  id="id2000_05AA">
</td> 
</tr> 
<tr>
<td>   
<input type="text" value="0"  id="id1000_01AA">
</td>
</tr> 
<tr>
<td>            
<input type="text" value="0"  id="id1000_02AA">
</td> 
</tr> 
<tr>
<td>            
<input type="text" value="0"  id="id1000_03AA"> 
</td>
</tr> 
<tr>
<td>             
<input type="text" value="0"  id="id1000_04AA">
</td>
</tr> 
<tr>
<td>            
<input type="text" value="0"  id="id1000_05AA">
</td>           
</tr> 
<tr>
<td>            
<input type="text" value="0"  id="id500_01AA">
</td>
</tr> 
<tr>
<td>           
<input type="text" value="0"  id="id500_02AA">
</td> 
</tr> 
<tr>
<td>            
<input type="text" value="0"  id="id500_03AA"> 
</td>
</tr> 
<tr>
<td>            
<input type="text" value="0"  id="id500_04AA">
</td>
</tr> 
<tr>
<td>            
<input type="text" value="0"  id="id500_05AA">
</td>         
</tr>        
<tr>
<td>            
<input type="text" value="0"  id="id200_01AA">
</td>
</tr> 
<tr>
<td>            
<input type="text" value="0"  id="id200_02AA">
</td> 
</tr> 
<tr>
<td>             
<input type="text" value="0"  id="id200_03AA"> 
</td>
</tr> 
<tr>
<td>             
<input type="text" value="0"  id="id200_04AA">
</td>
</tr> 
<tr>
<td>            
<input type="text" value="0"  id="id200_05AA">
</td>         
</tr>            
</div>
</table>
</form>
</div>
<!-- MODULE II ---->
<div>
<form style="border:0px solid #1f3f79; float:left; padding-left: 5px;">
<table>
<div>
<tr>
<tr>
<td>
<label>MODULE II</label>
<br>
<input type="text" value="0"  id="id2000_01BB">
</td> 
</tr>
<tr>
<td>
<input type="text" value="0"  id="id2000_02BB">
</td>
</tr> 
<tr>
<td>    
<input type="text" value="0"  id="id2000_03BB"> 
</td>
</tr> 
<tr>
<td> 
<input type="text" value="0"  id="id2000_04BB">
</td>
</tr> 
<tr>
<td> 
<input type="text" value="0"  id="id2000_05BB">
</td> 
</tr> 
<tr>
<td>   
<input type="text" value="0"  id="id1000_01BB">
</td>
</tr> 
<tr>
<td>            
<input type="text" value="0"  id="id1000_02BB">
</td> 
</tr> 
<tr>
<td>            
<input type="text" value="0"  id="id1000_03BB"> 
</td>
</tr> 
<tr>
<td>             
<input type="text" value="0"  id="id1000_04BB">
</td>
</tr> 
<tr>
<td>            
<input type="text" value="0"  id="id1000_05BB">
</td>           
</tr> 
<tr>
<td>            
<input type="text" value="0"  id="id500_01BB">
</td>
</tr> 
<tr>
<td>           
<input type="text" value="0"  id="id500_02BB">
</td> 
</tr> 
<tr>
<td>            
<input type="text" value="0"  id="id500_03BB"> 
</td>
</tr> 
<tr>
<td>            
<input type="text" value="0"  id="id500_04BB">
</td>
</tr> 
<tr>
<td>            
<input type="text" value="0"  id="id500_05BB">
</td>         
</tr>        
<tr>
<td>            
<input type="text" value="0"  id="id200_01BB">
</td>
</tr> 
<tr>
<td>            
<input type="text" value="0"  id="id200_02BB">
</td> 
</tr> 
<tr>
<td>             
<input type="text" value="0"  id="id200_03BB"> 
</td>
</tr> 
<tr>
<td>             
<input type="text" value="0"  id="id200_04BB">
</td>
</tr> 
<tr>
<td>            
<input type="text" value="0"  id="id200_05BB">
</td>         
</tr>            
</div>
</table>
</form>
</div>
<!-- MODULE III ---->
<div>
<form style="border:0px solid #1f3f79; float:left; padding-left: 5px;">
<table>
<div>
<tr>
<tr>
<td>
<label>MODULE III</label>
<br>
<input type="text" value="0"  id="id2000_01CC">
</td> 
</tr>
<tr>
<td>
<input type="text" value="0"  id="id2000_02CC">
</td>
</tr> 
<tr>
<td>    
<input type="text" value="0"  id="id2000_03CC"> 
</td>
</tr> 
<tr>
<td> 
<input type="text" value="0"  id="id2000_04CC">
</td>
</tr> 
<tr>
<td> 
<input type="text" value="0"  id="id2000_05CC">
</td> 
</tr> 
<tr>
<td>   
<input type="text" value="0"  id="id1000_01CC">
</td>
</tr> 
<tr>
<td>            
<input type="text" value="0"  id="id1000_02CC">
</td> 
</tr> 
<tr>
<td>            
<input type="text" value="0"  id="id1000_03CC"> 
</td>
</tr> 
<tr>
<td>             
<input type="text" value="0"  id="id1000_04CC">
</td>
</tr> 
<tr>
<td>            
<input type="text" value="0"  id="id1000_05CC">
</td>           
</tr> 
<tr>
<td>            
<input type="text" value="0"  id="id500_01CC">
</td>
</tr> 
<tr>
<td>           
<input type="text" value="0"  id="id500_02CC">
</td> 
</tr> 
<tr>
<td>            
<input type="text" value="0"  id="id500_03CC"> 
</td>
</tr> 
<tr>
<td>            
<input type="text" value="0"  id="id500_04CC">
</td>
</tr> 
<tr>
<td>            
<input type="text" value="0"  id="id500_05CC">
</td>         
</tr>        
<tr>
<td>            
<input type="text" value="0"  id="id200_01CC">
</td>
</tr> 
<tr>
<td>            
<input type="text" value="0"  id="id200_02CC">
</td> 
</tr> 
<tr>
<td>             
<input type="text" value="0"  id="id200_03CC"> 
</td>
</tr> 
<tr>
<td>             
<input type="text" value="0"  id="id200_04CC">
</td>
</tr> 
<tr>
<td>            
<input type="text" value="0"  id="id200_05CC">
</td>         
</tr>            
</div>
</table>
</form>
</div>

<div>
<input type='button' id="botonREGISTRAR" value='REGISTER' onclick="get_New_Balances()">
</div>

<script>
function get_New_Balances() {
google.script.run.getValuesFromForm_Balance_001A(document.getElementById("id2000_01AA").value);
google.script.run.getValuesFromForm_Balance_002A(document.getElementById("id2000_02AA").value);
google.script.run.getValuesFromForm_Balance_003A(document.getElementById("id2000_03AA").value);
google.script.run.getValuesFromForm_Balance_004A(document.getElementById("id2000_04AA").value);
google.script.run.getValuesFromForm_Balance_005A(document.getElementById("id2000_05AA").value);
google.script.run.getValuesFromForm_Balance_006A(document.getElementById("id1000_01AA").value);
google.script.run.getValuesFromForm_Balance_007A(document.getElementById("id1000_02AA").value);
google.script.run.getValuesFromForm_Balance_008A(document.getElementById("id1000_03AA").value);
google.script.run.getValuesFromForm_Balance_009A(document.getElementById("id1000_04AA").value);
google.script.run.getValuesFromForm_Balance_010A(document.getElementById("id1000_05AA").value);    
google.script.run.getValuesFromForm_Balance_011A(document.getElementById("id500_01AA").value);
google.script.run.getValuesFromForm_Balance_012A(document.getElementById("id500_02AA").value);
google.script.run.getValuesFromForm_Balance_013A(document.getElementById("id500_03AA").value);
google.script.run.getValuesFromForm_Balance_014A(document.getElementById("id500_04AA").value);
google.script.run.getValuesFromForm_Balance_015A(document.getElementById("id500_05AA").value);    
google.script.run.getValuesFromForm_Balance_016A(document.getElementById("id200_01AA").value);
google.script.run.getValuesFromForm_Balance_017A(document.getElementById("id200_02AA").value);
google.script.run.getValuesFromForm_Balance_018A(document.getElementById("id200_03AA").value);
google.script.run.getValuesFromForm_Balance_019A(document.getElementById("id200_04AA").value);
google.script.run.getValuesFromForm_Balance_020A(document.getElementById("id200_05AA").value);    
google.script.run.getValuesFromForm_Balance_001B(document.getElementById("id2000_01BB").value);
google.script.run.getValuesFromForm_Balance_002B(document.getElementById("id2000_02BB").value);
google.script.run.getValuesFromForm_Balance_003B(document.getElementById("id2000_03BB").value);
google.script.run.getValuesFromForm_Balance_004B(document.getElementById("id2000_04BB").value);
google.script.run.getValuesFromForm_Balance_005B(document.getElementById("id2000_05BB").value);
google.script.run.getValuesFromForm_Balance_006B(document.getElementById("id1000_01BB").value);
google.script.run.getValuesFromForm_Balance_007B(document.getElementById("id1000_02BB").value);
google.script.run.getValuesFromForm_Balance_008B(document.getElementById("id1000_03BB").value);
google.script.run.getValuesFromForm_Balance_009B(document.getElementById("id1000_04BB").value);
google.script.run.getValuesFromForm_Balance_010B(document.getElementById("id1000_05BB").value);    
google.script.run.getValuesFromForm_Balance_011B(document.getElementById("id500_01BB").value);
google.script.run.getValuesFromForm_Balance_012B(document.getElementById("id500_02BB").value);
google.script.run.getValuesFromForm_Balance_013B(document.getElementById("id500_03BB").value);
google.script.run.getValuesFromForm_Balance_014B(document.getElementById("id500_04BB").value);
google.script.run.getValuesFromForm_Balance_015B(document.getElementById("id500_05BB").value);    
google.script.run.getValuesFromForm_Balance_016B(document.getElementById("id200_01BB").value);
google.script.run.getValuesFromForm_Balance_017B(document.getElementById("id200_02BB").value);
google.script.run.getValuesFromForm_Balance_018B(document.getElementById("id200_03BB").value);
google.script.run.getValuesFromForm_Balance_019B(document.getElementById("id200_04BB").value);
google.script.run.getValuesFromForm_Balance_020B(document.getElementById("id200_05BB").value);    
google.script.run.getValuesFromForm_Balance_001C(document.getElementById("id2000_01CC").value);
google.script.run.getValuesFromForm_Balance_002C(document.getElementById("id2000_02CC").value);
google.script.run.getValuesFromForm_Balance_003C(document.getElementById("id2000_03CC").value);
google.script.run.getValuesFromForm_Balance_004C(document.getElementById("id2000_04CC").value);
google.script.run.getValuesFromForm_Balance_005C(document.getElementById("id2000_05CC").value);
google.script.run.getValuesFromForm_Balance_006C(document.getElementById("id1000_01CC").value);
google.script.run.getValuesFromForm_Balance_007C(document.getElementById("id1000_02CC").value);
google.script.run.getValuesFromForm_Balance_008C(document.getElementById("id1000_03CC").value);
google.script.run.getValuesFromForm_Balance_009C(document.getElementById("id1000_04CC").value);
google.script.run.getValuesFromForm_Balance_010C(document.getElementById("id1000_05CC").value);    
google.script.run.getValuesFromForm_Balance_011C(document.getElementById("id500_01CC").value);
google.script.run.getValuesFromForm_Balance_012C(document.getElementById("id500_02CC").value);
google.script.run.getValuesFromForm_Balance_013C(document.getElementById("id500_03CC").value);
google.script.run.getValuesFromForm_Balance_014C(document.getElementById("id500_04CC").value);
google.script.run.getValuesFromForm_Balance_015C(document.getElementById("id500_05CC").value);    
google.script.run.getValuesFromForm_Balance_016C(document.getElementById("id200_01CC").value);
google.script.run.getValuesFromForm_Balance_017C(document.getElementById("id200_02CC").value);
google.script.run.getValuesFromForm_Balance_018C(document.getElementById("id200_03CC").value);
google.script.run.getValuesFromForm_Balance_019C(document.getElementById("id200_04CC").value);
google.script.run.getValuesFromForm_Balance_020C(document.getElementById("id200_05CC").value);    

}
</script> 
</body>   
</html>
ONTIVER
  • 75
  • 5
  • 2
    It looks like it's a rectangular array of cells so you can send a 2d array and use setValues() it will probably be 10X faster. I'd probably incorporate the row and the column into the id thus making it possible to loop through the data clientside and pass a 2d array to the spreadsheet. Keep in mind that there are [restrictions](https://developers.google.com/apps-script/guides/html/communication#parameters_and_return_values) about what types can be passed. – Cooper Jul 15 '21 at 19:13
  • If I'm wrong about the rectangular array then a rangelist might be your best next option. In situations like this it's nice to be able to make you data a rectangular and contiguous array so that data transfers are much faster. In situation where this can't be done you can sometimes use an intermediate sheet to perform the mapping from with formulas. – Cooper Jul 15 '21 at 19:21
  • Thanks for your answer. Indeed, have to use SetValues(). – ONTIVER Jul 16 '21 at 02:51

2 Answers2

1

Here is the optimized and working code. Read the change logs below.

Code.gs:

function doGet() {
  var template = HtmlService.createTemplateFromFile("HTML_start_page")
  return template.evaluate().setSandboxMode(HtmlService.SandboxMode.IFRAME);
}

function getValuesFromForm(inputs){  
  var ss = SpreadsheetApp.openByUrl("spreadsheet url");
  var sheet_Balance = ss.getSheetByName("Page_1");
  // use setValues to write the 2D data by bulk
  sheet_Balance.getRange(267, 7, inputs.length, inputs[0].length).setValues(inputs);
}

HTML_start_page.html:

<!DOCTYPE html>
<html>

<body>
    <div>
        <form style="border:0px solid #1f3f79; float:left; padding-left: 5px;">
            <table id="table">
                <tr>
                    <td><label>MODULE I</label></td>
                    <td><label>MODULE II</label></td>
                    <td><label>MODULE III</label></td>
                    <td><label>MODULE IV</label></td>
                </tr>
            </table>
        </form>
    </div>
    <div>
        <input type='button' id="botonREGISTRAR" value='REGISTER' onclick="get_New_Balances()">
    </div>

    <script>
      window.onload = function () {
        // automatically generate input rows
        var table = document.getElementById("table");
        var row, input, cell;
    
        for (i = 0; i < 30; i++) {
          row = table.insertRow();
          for (j = 0; j < 4; j++) {
            input = document.createElement('input')
            input.type='text';
            input.value='0';
            cell = row.insertCell();
            cell.appendChild(input);
          } 
        }
      };

      function get_New_Balances() {
        var tableRows = document.getElementById("table").rows;
        var myrow, mytd;
        var row = [], inputs = [];

        for (i = 1; i < tableRows.length; i++) {
          myrow = tableRows[i];
          row = [];
          for (j = 0; j < myrow.cells.length; j++) {
            mytd = myrow.cells[j];
            row.push(mytd.children[0].value);
          }
          inputs.push(row);
        }
        
        google.script.run.getValuesFromForm(inputs);
      }
    </script>
</body>

</html>

Change logs:

  • HTML table is now generated by a loop.
  • get_New_Balances now creates a 2D array from the table, and then passes it to the new function that writes 2D data directly to the sheet
  • getValuesFromForm is now using setValues to write the 2D data generated from the get_New_Balances

Input:

input

Output:

output

References:

NightEye
  • 10,634
  • 2
  • 5
  • 24
1

About the same solution as @NaziA, without auto generation the HTML:

HTML:

...

<script>
  function get_New_Balances() {

    var nums1   = ['2000', '1000', '500', '200'];
    var nums2   = ['01', '02', '03', '04', '05'];
    var letters = ['AA', 'BB', 'CC'];
    var values  = [];

    letters.forEach(letter => nums1.forEach(n1 => nums2.forEach(n2 => {
      var id = 'id' + n1 + '_' + n2 + letter;
      values.push(document.getElementById(id).value);
    })));

    var table = new Array(values.length / letters.length).fill('');

    table = table.map((_, row) => 
      letters.map((_, col) => values[row + table.length * col]));

    google.script.run.main(table);
  }
</script>

...

GS:

function doGet() {
  var template = HtmlService.createTemplateFromFile("HTML_start_page");
  return template.evaluate().setSandboxMode(HtmlService.SandboxMode.IFRAME);
}

function main(table) {
  var ss = SpreadsheetApp.openByUrl("URL");
  var sheet_Balance = ss.getSheetByName("Page_1");
  sheet_Balance.getRange(267,6,table.length,table[0].length).setValues(table);
}
Yuri Khristich
  • 13,448
  • 2
  • 8
  • 23