Блог

Я все еще новичок в HTML / JavaScript, так что потерпите

Я пытаюсь создать форму с помощью скрипта Google Apps для ввода информации о запросе предложения.
У меня есть поле выбора, в котором пользователь вводит состояние адреса, и поле ввода, в котором они вводят пригород. У меня также есть элемент datalist, чтобы пользователь мог выбрать свой пригород из выпадающего списка.

С чем я борюсь, так это с тем, что я хотел бы иметь разные значения в списке данных для каждого состояния.
Так, например, если пользователь выберет «Состояние A», список ввода пригородов будет иметь параметры «A», «B», «C», но если пользователь выберет «Состояние B», список ввода пригородов будет иметь параметры «D», «E», «F»

Поскольку это в скрипте Google Apps, у меня есть код для получения соответствующих параметров из таблицы Google, проблема заключается в запуске кода на стороне клиента для обновления списка данных.
Я пробовал искать, но предложения, на которые я ссылался, похоже, не работают.

Вот HTML

 <select id="cust_state" name="cust_state" onchange="get_suburbs()" required>
   <option selected disabled value="">- Select a state -</option>
   <option>State A</option>
   <option>State B</option>
   <option>State C</option>
</select>

<input type="text" list="cust_suburbs" id="site_suburb" name="site_suburb" required/>
   <datalist id="cust_suburbs">Update this list</datalist>
  

И вот самый последний js-код, который я пробовал

 function get_suburbs() {
   var selected_state = document.getElementById("cust_state").value; 
   var suburbs = google.script.run.query_suburbs(selected_state);
   var dynamic_suburbs = document.getElementById("cust_suburbs");
      
   suburbs.forEach( function ( item ) { 
      // Create a new <option> element. 
      var option = document.createElement( 'option' ); 
      
      // Set the value using the item in the array. 
      option.value = item; 
      // Add the <option> element to the <datalist>. 
      dynamic_suburbs.appendChild( option ); 
   });
};
  

Заранее спасибо!

Я нашел решение.

Оказывается, я неправильно обрабатывал возвращаемые значения и нуждался в обработчике успеха

Новый JS-код

 function get_suburbs() {
      var selected_state = document.getElementById("cust_state").value; 
      var suburbs = google.script.run.withSuccessHandler(update_list).query_suburbs(selected_state);
   };
   
   function update_list(suburbs){
      var dynamic_suburbs = document.getElementById("cust_suburbs");
      
      suburbs.forEach( function ( item ) { 
         // Create a new <option> element. 
         var option = document.createElement( 'option' ); 
       
         // Set the value using the item in the array. 
         option.value = item; 
         // Add the <option> element to the <datalist>. 
         dynamic_suburbs.appendChild( option ); 
      });
   }