Processing multiple selects

ameliabob · March 2, 2021

I cannot find an example of how to process multiple selections from an option

[code]

<!DOCTYPE HTML
PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

function DoCustomSearch(){
n = document.getElementById("fieldNames").value;
alert("selected fieldNames are "+n);
alert(s);
}

function ShowAdvancedQueryWindow(){

        s += "<select id='fieldNames' name='fieldNames' size='10' multiple >";
           s +=    "<option value='recNo'>Record Number</option>";
           s +=    "<option value='oName'>Listing Name</option>";
           s +=    "<option value='stNumber'>Street Number</option>";
           s +=    "<option value='stName'>Street Name</option>";
           s +=    "<option value='telno'>Telephone number</option>";
           s +=    "<option value='email'>email</option>";
           s +=    "<option value='showTel'>Show Telno</option>";
           s +=    "<option value='showEmail'>Show email</option>";
           s +=    "<option value='blastEmail'>BlastEmail</option>";
           s +=    "<option value='password'>Password</option>";
       s += "</select>"

        s += "<button type=button onclick='DoCustomSearch()'>Do Search</button>";

   document.getElementById('mainBody').innerHTML = s;
   }

</script>
<body onload="ShowAdvancedQueryWindow()">

<div id="mainBody" >

</div>

</body>
</html>

[\code]

If I select multiple options how do I know which of these are selected when I go to "DoCustomSearch()"?

JMRKER · March 4, 2021

See if you can modify this to your needs:

 <!DOCTYPE HTML
PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<!-- From: https://w3schools.invisionzone.com/topic/62669-processing-multiple-selects/ -->
<head>
<meta charset="UTF-8">
<link rel="stylesheet" type="text/css" href="/dunes.css" media="screen" />
</head>
<body onload="ShowAdvancedQueryWindow()">
   
<div id="mainBody" >
</div>

<script type="text/javascript">
function DoCustomSearch(){
  var values = [];
  n = document.getElementById("fieldNames");
  for (let i=0; i<n.options.length; i++) { 
    if (n[i].selected) { values.push(n[i].value || n[i].text); }
  }        
  alert("selected fieldNames are\n"+values.join('\n'));    
}

function ShowAdvancedQueryWindow(){
  var s  = "<select id='fieldNames' name='fieldNames' size='10' multiple >";
      s += "<option value='recNo'>Record Number</option>";
      s += "<option value='oName'>Listing Name</option>";
      s += "<option value='stNumber'>Street Number</option>";
      s += "<option value='stName'>Street Name</option>";
      s += "<option value='telno'>Telephone number</option>";
      s += "<option value='email'>email</option>";
      s += "<option value='showTel'>Show Telno</option>";
      s += "<option value='showEmail'>Show email</option>";
      s += "<option value='blastEmail'>BlastEmail</option>";
      s += "<option value='password'>Password</option>";
      s += "</select>"
      s += "<button type=button onclick='DoCustomSearch()'>Do Search</button>";
  document.getElementById('mainBody').innerHTML = s;
}
</script>

</body>
</html>

Sign In

Processing multiple selects

Recommended Posts

ameliabob

Link to comment

Share on other sites

JMRKER

Link to comment

Share on other sites

Create an account or sign in to comment

Create an account

Sign in

Browse

Activity