JQuery Mobile - Getting the Value of a SelectMenu

Question

When I attempt to get the value from my the select menu, I get an empty value.

I know the reason I do is that the jquery mobile markup results in two items with a class of "mySelect"-- so the selector $(".selectMenu") is a wrapped set.

I am wondering if there is a way to get the value through the plug in- something like $(".mySelect").selectmenu("value"), or something like that.

<section data-role="page">
<section data-role="content">
    <input type="button" value="what is the value" id="myButton"/>
    <select class="mySelect">
        <option value="1">one</option>
        <option value="2">two</option>
        <option value="3">three</option>
    </select>
 </section>
</section>

$("#myButton").click(function(){
    var val = $(".mySelect").val();
    alert(val);
});

http://jsfiddle.net/9HG9t/

Solution 1

You can do this to get the value.

$(".mySelect option:selected").val()

Example: http://jsfiddle.net/9HG9t/1/

Solution 2

Just use classic jQuery way:

$("#myButton").click(function(){
    var val = $(".mySelect").find(":selected").text();
    alert(val);
});

Live example: http://jsfiddle.net/Gajotres/ANVQb/