Get Selected value from dropdown using JavaScript

craig picture craig · Sep 17, 2013 · Viewed 227k times · Source

I have the following HTML

<form>
  <div class="answer1wrap">
    <select id="mySelect">
      <option value="void">Choose your answer</option>
      <option value="To measure time">To measure time</option>
      <option value="To measure distance">To measure distance</option>
      <option value="To measure volume">To measure volume</option>
    </select>
  </div>
</form>

<button class="btn btn-default" id="checkbtn" onclick="answers();" type="button"><span    class="glyphicon glyphicon-check"></span> Check answers</button>

I also have the javascript

function answers()
{
  var selectedanswer=document.getElementById("mySelect").selectedIndex;

  if (document.getElementsByTagName("option")[selectedanswer].value=="To measure time");{
    alert("Thats correct"); 
  }
}

I was hoping that when the button is pressed, it would check to see if the 'to measure time' option was selected and alert me ONLY if that was selected. However no matter which option has been selected it always shows the alert.

Any ideas?

Answer

cocco picture cocco · Sep 17, 2013

Maybe it's the comma in your if condition.

function answers() {
var answer=document.getElementById("mySelect");
 if(answer[answer.selectedIndex].value == "To measure time.") {
  alert("That's correct!"); 
 }
}

You can also write it like this.

function answers(){
 document.getElementById("mySelect").value!="To measure time."||(alert('That's correct!'))
}