When trying to get the value of the drop-down list to be created in gas, the error Uncaught TypeError: Cannot read property 'selectedIndex' of undefined appears.

We are currently using Google apps script to create a code that reflects the value of the post form created in index.html in the Google spreadsheet.

If you try to retrieve the selected value from the drop-down list, you will receive the following error:

 userCodeAppPanel:26 Uncaught TypeError: Cannot read property 'selectedIndex' of undefined

The code is as follows:
code.gs

// A function that returns drop-down data to the HTML side
function dropman1(){
// Get sheet
vars = SpreadsheetApp.openById("ID of splet sheet");
var list=ss.getSheetByName("List").getRange("B2:B").getValues(); // List of employees
// Return Retrieved Data
return JSON.stringify(list); 
}

index.html

<body>
  <div class="addNew">
    <divid="employee">
      <img border="0" src="https://officeforest.org/wp/library/ProgressSpinner.gif" width="20" height="20">
    </div>
  </div>

 <script type="text/javascript">
   function submitPost(){
    const data={};
    variable employee= document.employee;
    var num1 = employee.selectedIndex;
    data.employee=employee.options[num1].value;
    google.script.run.withSuccessHandler(getPostOutput).sendPosts(data);
    console.log(data);
    }
   google.script.run.withSuccessHandler(onSuccess).dropman1();
   function onSuccess(data){
    varjson=JSON.parse(data);
    var datalength = json.length;
           // Label
    var html="<label>Employee Name:</label><br>";

       // Insert the head of the select tag
    html+="<select name='employee'><option>Enter your name</option>";

       // Generating HTML data
    for (vari=0;i<datalength;i++) {
       // Loop escape for empty data
    if(json[i]==""){
        break;
    }
       // Add optional items
    html+="<option>"+json[i]+"</option>"
    }
    // Under select tag
    html+="</select><p>";

    // Install the pull-down menu
    document.getElementById("employee").innerHTML = html;
   }
 </script>
</body>

Now, the drop-down list wants to see the list of splet sheets instead of hard-coating html, so we decided to write the function on code.gs.

Please let me know the solution to the above error.
The following is the site I used to refer to when creating the code.

Create input complements and pulldowns in Google Apps Script:
https://officeforest.org/wp/2019/05/23/google-apps-script%E3%81%A7%E5%85%A5%E5%8A%9B%E8%A3%9C%E5%AE%8C%E3%81%A8%E3%83%97%E3%83%AB%E3%83% 80% E3% 82% A6% E3% 83% B3% E3% 82% E4% BD% 9C% E3% 82% 8B/a>

Sample to retrieve/set JavaScript select box values:
https://itsakura.com/js-selectbox

javascript google-apps-script

2022-09-30 13:45

1 Answers

vare employee= document.employee;

does not appear to point correctly to <select name='employee'>. To get the select element correctly

vare employee= document.querySelector("[name=employee]");

Why don't you rewrite it as shown in ?

2022-09-30 13:45

If you have any answers or tips

Popular Tags

python x 4647

android x 1593

java x 1494

javascript x 1427

c x 927

c++ x 878

ruby-on-rails x 696

php x 692

python3 x 685

html x 656