Tom Avni
Tom Avni

Reputation: 139

Send select value to JS function

I have the next menu in HTML:

<select name="p1">
  <option value="A">A</option>
  <option value="B">B</option>
  <option value="C">C</option>
</select>

Now, I want to send it to my JS function:

function myFunc(menuValue){
//do something
}

How can I do it?

Upvotes: 0

Views: 117

Answers (3)

PSL
PSL

Reputation: 123739

So you want to get the value of the selected option onchange of option value right? You can try this way:-

http://jsfiddle.net/T8CKU/

<select name="p1" onchange="myfunc(this.value);">
  <option value="A">A</option>
  <option value="B">B</option>
  <option value="C">C</option>
</select>

function myFunc(menuValue){
    alert(menuValue)
}

Here inside myFunc the context of `this would be the window. If you want to get the context inside the window as the dropdown itself you can use apply or call.

<select name="p1" onchange="myFunc.call(this);">
  <option value="A">A</option>
  <option value="B">B</option>
  <option value="C">C</option>
</select>

function myFunc(){
    alert(this.value); //This will give the value again.
}

Upvotes: 1

Alex
Alex

Reputation: 7833

The select element in HTML offers an onchange event that fires if you select a new value (new = an option that was not selected).

<select name="p1" onchange="myFunc(option);">
  <option value="A">A</option>
  <option value="B">B</option>
  <option value="C">C</option>
</select>

function myFunc(option) {
  // whatever you need to do
};

Upvotes: 0

Yoann
Yoann

Reputation: 3060

Something like this :

Javascript :

var selectObj = document.querySelector("#selectID"),
    displayObj = document.querySelector(".display");
selectObj.onchange = function(evt){
    myFunc(this.value);
}

function myFunc(menuValue){
    displayObj.innerHTML = menuValue; 
}

HTML :

<select id = "selectID" name="p1">
  <option value="A">A</option>
  <option value="B">B</option>
  <option value="C">C</option>
</select>
<div class='display'></div>

http://jsfiddle.net/NeekGerd/4H5aq/

Upvotes: 2

Related Questions