datalist selected value is “null” in the sheet

I have a datalist problem : I have too much values in my datalist to use a simple select. I changed my html to use a datalist instead. The problem is that the selected value is “null” when i want to set it in the sheet. The values are like : “PDCTLEA1-N00C06” in “mesSwitchs” list.

<script>              
              function validerAd()  
              {
            
                let idPort1a = document.getElementById("idPort1a").value; 
                
                google.script.run.nouvAdresse(idPort1a);
              }
<form>
      <p8>
          <label for="idPort1a" id="labelPort1a">Choisissez un switch :</label>
          <input list="idPort1a" name="idPort1a" id="idPort1aListe">

          <datalist id="idPort1a">
            <br/>
            <? for (var i = 0; i < mesSwitchs.length; i++) { ?>
            <option value="<?= mesSwitchs[i][0] ?>" ><?= mesSwitchs[i][0] ?></option>
            <? } ?>
          </datalist>
      </p8>
function nouvAdresse(idPort1a)
{
 AdressesIP.getRange(2,2).setValue(idPort1a);
}

In the sheet, it will set “null” instead of the selected value. Do you know why ?

Answer

Issue:

Even if you don’t have a typo in your actual code, it looks like you are retrieving the value from <datalist>; datalist elements do not have a value attribute, so this will always remain undefined:

let idPort1a = document.getElementById("idPort1a").value; 

Solution:

If you want to get the selected option, you should retrieve the value from the corresponding <input> element instead:

function validerAd() {
  let idPort1aListe = document.getElementById("idPort1aListe").value; 
  google.script.run.nouvAdresse(idPort1aListe);
}

Other issue:

As others said, there’s a typo in the code you provided:

function nouvAdresse(idPort1a) {
 AdressesIP.getRange(2,2).setValue(idPort1); // idPort1 should match the function argument
}