CODEWITHSUNDEEP
javascriptjquery-mobile
Waiom
Waiom

Reputation: 35

how to popup jQuery mobile select with JavaScript?

I want to popup jQuery mobile select with JavaScript.

<select class="select1" name="select1" id="select1" data-native-menu="false">
       <option value="1">Opt1</option>
       <option value="2">Opt2</option>
       <option value="3" disabled="disabled">Opt3</option>
       <option value="4">The 4th Option</option>
       </select>

Clicking this to open 

<p onClick="test()">OpenUp</p>

Function:

test= function() {
$( ".select1" ).selectmenu( "open" );
}

But I got an error:

Uncaught Error: cannot call methods on selectmenu prior to initialization; attempted to call method 'open'

Fiddle http://jsfiddle.net/k3Dz6/

How to fix it? ty!

Upvotes: 2

Views: 195

Answers (1)

Fr&#233;d&#233;ric Hamidi
Fr&#233;d&#233;ric Hamidi

Reputation: 262919

The select1 class is also assigned to a <span> element that is part of the selectmenu widget that augments your <select> element.

Therefore, $(".select1").length is 2, and $(".select1" ).selectmenu("open") invokes the selectmenu() method on the <span> element, which fails.

You can either identify the <select> element by id:

$("#select1").selectmenu("open");

Or restrict the class selector:

$("select.select1").selectmenu("open");

You will find an updated fiddle here.

Upvotes: 1

Related Questions