Javascript Form How to - Get selected dropdown list option








Question

We would like to know how to get selected dropdown list option.

Answer


<!--from   w w  w.j a v  a2 s  .  c o m-->
<html>
<head>
  <script type="text/javascript">
    function showWindow() {
      var sze = "";

      sze = document.form1.sizeList.options[document.form1.sizeList.options.selectedIndex].text;
      console.log(sze);
      
  }
  </script>
</head>
<body>
  <form method="post" name="form1" action="null">
      String:<input type="text" size="40" maxlength="256" name="stringField" />
      Size:
      <select name="sizeList" size="1">
        <option selected="selected">1</option>
        <option>2</option>
        <option>3</option>
        <option>4</option>
        <option>5</option>
        <option>6</option>
        <option>7</option>
      </select>
    <input type="button" name="Show" value="Show" onclick="showWindow()" />
  </form>
</body>
</html>

The code above is rendered as follows: