ariel
ariel

Reputation: 3072

Why does this JQuery dropdown plugin only work on the first dropdown?

I am using the following JQuery plugin for dropdown menus:

https://code.google.com/p/select-box/

I have 4 dropdown menus but the script only works for the first one. NOt sure what I need to tweak for it to work on the other 3.

Code:

<select name="question1" id="question_1">
     <option value="Yes">Yes</option>
     <option value="No">No</option>
</select>

<select name="question2" id="question_2">
    <option value="Yes">Yes</option>
    <option value="No">No</option>
</select>

<select name="question3" id="question_3">
    <option value="Yes">Yes</option>
    <option value="No">No</option>
</select>

<select name="question4" id="question_4">
     <option value="Yes">Yes</option>
     <option value="No">No</option>
</select>

Script:

<script type="text/javascript">
$(function () {
    $("#question_1").selectbox();
    $("#question_2").selectbox();
    $("#question_3").selectbox();
    $("#question_4").selectbox();
});
</script>

Upvotes: 2

Views: 901

Answers (1)

Joe
Joe

Reputation: 15528

It's happening because the plugin uses the deprecated (and now removed) .live() event binder.

In jquery.selectbox-0.2.js change line 303 from:

$("html").live('mousedown', function(e) {

to:

$("html").on('mousedown', function(e) {

Here it is working (without styles) with jQuery 1.10.1: http://jsfiddle.net/3q9Wg/

Upvotes: 5

Related Questions