如何以随机顺序修复 Google Apps 脚本函数运行

Question

我有一个项目将从 GSheet 生成一个动态列表框，它会更新我在 Google Apps 脚本中创建的自定义表单。

代码会在加载时从URL获取输入，并在获取输入数据以预填表单之前先生成2个ListBox。

所以序列应该是

生成汽车品牌选择
生成颜色选择
获取客户数据以预填表格

但我得到的是每当我刷新页面时，函数加载的顺序是随机的。有时它工作正常，有时它正在加载 3 > 1 > 2 或 2 > 3 > 1 或任何其他随机序列。

无论如何请提出建议，我们可以确保序列是运行按照设计。

下面是示例代码

Code.gs

var SHEET_CAR_URL = 'https://docs.google.com/spreadsheets/d/{sheet1ID}/edit#gid=0';
var SHEET_COLOUR_URL = 'https://docs.google.com/spreadsheets/d/{sheet2ID}/edit#gid=0';
var SHEET_CUSTOMER_URL = 'https://docs.google.com/spreadsheets/d/{sheet2ID}/edit#gid=0';


function doGet(request) {
 return HtmlService.createTemplateFromFile('CustomerForm').evaluate().setTitle("Demo Form");
}

function include(filename) {
  return HtmlService.createHtmlOutputFromFile(filename)
      .getContent();
}

function loadCarList(){
  //load Cars GSheet
  var carsspreadsheet = SpreadsheetApp.openByUrl(SHEET_CAR_URL).getSheetByName('Cars');
  numItemCars = carsspreadsheet.getLastRow()-1;// get the number of rows in the sheet
  colItemCars = carsspreadsheet.getLastColumn();// get the number of rows in the sheet
  listCarsArray = carsspreadsheet.getRange(2,1,numItemCars,colItemCars).getValues(); 

  var listCar = "<option value=''></option>";  
   for(var i=0; i<numItemCars; i++){
    listCar += "<option value='"+listCarsArray[i][0]+"'>"+listCarsArray[i][0]+"</option>";
  }
  Logger.log(listCar);
  return listCar;
}

function loadColourList(){
  //load Colour GSheet
  var colourspreadsheet = SpreadsheetApp.openByUrl(SHEET_COLOUR_URL).getSheetByName('Colour');
  numItemColour = colourspreadsheet.getLastRow()-1;// get the number of rows in the sheet
  colItemColour = colourspreadsheet.getLastColumn();// get the number of rows in the sheet
  listColourArray = colourspreadsheet.getRange(2,1,numItemColour,colItemColour).getValues();

  var listColour = "<option value=''></option>";  
   for(var i=0; i<numItemColour; i++){
    listColour += "<option value='"+listColourArray[i][0]+"'>"+listColourArray[i][0]+"</option>";
  }
  Logger.log(listColour);
  return listColour;
}

function loadCustomer(inputID){
  //load Customer GSheet
  var customerspreadsheet = SpreadsheetApp.openByUrl(SHEET_CUSTOMER_URL).getSheetByName('Customer');
  numItemCust = customerspreadsheet.getLastRow()-1;// get the number of rows in the sheet
  colItemCustr = customerspreadsheet.getLastColumn();// get the number of rows in the sheet
  listCustArray = customerspreadsheet.getRange(2,1,numItemCust,colItemCustr).getValues(); 

  var custDetails = [];
   for(var i=0; i<numItemCust; i++){
    var custID = listCustArray[i][0];
    var custName = listCustArray[i][1];
    var custArea = listCustArray[i][2];
    var custCar = listCustArray[i][2];
    var custCarColour = listCustArray[i][2];
    if(custID == inputID){
      custDetails = [custID,custName,custArea,custCar,custCarColour];
    }
  }
  Logger.log(custDetails[0]);
  return custDetails;
}

CustomerForm.html

<!DOCTYPE html>
<html>
  <head>
    <base target="_top">
  </head>
  <body onload="myLoadFunction()">
    <table>
      <tr>
        <td> Customer ID : </td>
        <td> <input type="text" id="CustID"> </td>
      </tr>
      <tr>
        <td> Customer Name : </td>
        <td> <input type="text" id="CustName"></td>
      </tr>
      <tr>
        <td> Customer Area : </td>
        <td> <input type="text" id="CustArea"></td>
      </tr>
      <tr>
        <td> Car Brand : </td>
        <td><select class='listbox' id='listCar' required></select> </td>
      </tr>
      <tr>
        <td> Car Colour : </td>
        <td><select class='listbox' id='listColour' required></select> </td>
      </tr>
    </table>
  </body>
</html>
<script>

function myLoadFunction(){
    // Get the URL parameter
    google.script.url.getLocation(inputstrings => {
 
        let inputjson =  JSON.stringify(inputstrings.parameter);
        let inputparameters = JSON.parse(inputjson)
        var in_custID = inputparameters.id;
        alert('This is the ID '+in_custID);

        google.script.run.withSuccessHandler(initializeCar).loadCarList(); 
        google.script.run.withSuccessHandler(initializeColour).loadColourList(); 

        google.script.run.withSuccessHandler(initializeForm).loadCustomer(in_custID); 

    })

    function initializeCar(inputList){
      alert('Loading Cars')
      document.getElementById('listCar').innerHTML = inputList;   
    }
    
    function initializeColour(inputList){
      alert('Loading Colour')
      document.getElementById('listColour').innerHTML = inputList;   
    }

    function initializeForm(inputDetails){
      alert('Loading Form')
      document.getElementById('CustID').value = inputDetails[0];
      document.getElementById('CustName').value = inputDetails[1];
      document.getElementById('CustArea').value = inputDetails[2];
      document.getElementById('listCar').value = inputDetails[3];
      document.getElementById('listColour').value = inputDetails[4];
    }
}

</script>

样本客户数据

ID No	Customer Name	Customer Area	Car Brand	Car Colour
1001	Alice	IN	Toyota	Blue
1002	Bob	OH	Honda	Red
1003	Charlie	WD	BMW	Brown

样品颜色

Colour
Blue
Red
Brown
Green
Yellow

样车品牌

Brand
BMW
Toyota
Honda
Tesla
VW

我尝试使用 If Else 来确保在运行第三个函数之前已经填充了 ListBox，但没有成功。

提前感谢任何可以提供帮助的人。

Answer 1

因为 google.script.run 运行是异步的，这意味着第二个不会在运行ning 之前等待第一个到 return。你需要嵌套它们。然后在html<script>干脆运行第一个而已。我已将 in_custID 移到 setLocation 调用之外，以便其他函数可以使用它。

function myLoadFunction(){
    // Get the URL parameter
    var in_custID = null;
    google.script.url.getLocation(inputstrings => {
 
        let inputjson =  JSON.stringify(inputstrings.parameter);
        let inputparameters = JSON.parse(inputjson)
        in_custID = inputparameters.id;
        alert('This is the ID '+in_custID);

        google.script.run.withSuccessHandler(initializeCar).loadCarList(); 

    })

    function initializeCar(inputList){
      alert('Loading Cars')
      document.getElementById('listCar').innerHTML = inputList;
      google.script.run.withSuccessHandler(initializeColour).loadColourList(); 
    }
    
    function initializeColour(inputList){
      alert('Loading Colour')
      document.getElementById('listColour').innerHTML = inputList;   
      google.script.run.withSuccessHandler(initializeForm).loadCustomer(in_custID); 
    }

    function initializeForm(inputDetails){
      alert('Loading Form')
      document.getElementById('CustID').value = inputDetails[0];
      document.getElementById('CustName').value = inputDetails[1];
      document.getElementById('CustArea').value = inputDetails[2];
      document.getElementById('listCar').value = inputDetails[3];
      document.getElementById('listColour').value = inputDetails[4];
    }
}

如何以随机顺序修复 Google Apps 脚本函数运行

How to fix Google Apps Script Function Running in random sequence

javascript

google-apps-script

如何以随机顺序修复 Google Apps 脚本函数 运行

How to fix Google Apps Script Function Running in random sequence

javascript

google-apps-script

如何以随机顺序修复 Google Apps 脚本函数运行