title: Creating drop-down menu in Google Script custom dialogue, with options from data in a Google Sheet
body: <p>I am looking to create a drop down menu in a custom dialogue when you run a script. I have been successful in doing so, and also able to create a loop in a  element that creates a drop down list from a static array [i.e. an array of months and create a drop down menu]. However, I have been unsuccessful in being able to bull data from a google sheet, and using that data to create the drop-down menu.</p>
  
  <p>Example code that works for creating drop-down menu from array:</p>
  
  <p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
  <div class="snippet-code">
  <pre class="snippet-code-html lang-html prettyprint-override"><code>&lt;form&gt;
  &lt;select name="Month-test" id="month-selector-test" autofocus="autofocus" autocorrect="off" autocomplete="off"&gt;
    &lt;option value="" selected="selected" id="todays-month"&gt;&lt;/option&gt;
     &lt;script&gt; 
     // select this element
    var currentDayList = document.getElementById('month-selector-test');
    // array of all months
    var allMonthsAbv = ["Jan","Feb","Mar","Apr","May","Jun","Jul","Aug","Sep","Oct","Nov","Dec"];
    // for every element in the array, add an option
    for (var i=0; i&lt;allMonthsAbv.length; i++) {
      currentDayList.innerHTML += '&lt;option value=' + allMonthsAbv[i] + '&gt;' + allMonthsAbv[i] + '&lt;/option&gt;';
    }    
    &lt;/script&gt;
  &lt;/select&gt;
  &lt;/form&gt;</code></pre>
  </div>
  </div>
  </p>
  
  <p>Example code that does not work for creating drop down menu from data in sheet:</p>
  
  <p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
  <div class="snippet-code">
  <pre class="snippet-code-html lang-html prettyprint-override"><code>&lt;form&gt;
  &lt;select name="Month" id="month-selector" autofocus="autofocus" autocorrect="off" autocomplete="off"&gt;
    &lt;option value="" selected="selected"&gt;&lt;/option&gt;
      &lt;script&gt;
      var monthList = document.getElementById('month-selector');
      
      var allData = SpreadsheetApp.openById('###ID###').getSheetByName('###NAME###').getDataRange().getValues();
      var list = [];
      for (var i=1;i&lt;allData.length;i++) {
        var schoolName = allData[i][1];
        if (schoolName != "") {
        list.push(schoolName);
        }
      }
     for (var i = 0;i&lt;list.length;i++) {
      monthList.innerHTML += '&lt;option value=' + list[i] + '&gt;' + list[i] + '&lt;/option&gt;';
    }  
    &lt;/script&gt;
  &lt;/select&gt;
  &lt;/form&gt;</code></pre>
  </div>
  </div>
  </p>