Janani
Janani

Reputation: 201

How to retrieve all the selected items from multi-select dropdown box - jQuery mobile

I have 2 multi select dropdown boxes(ddb)(I use jQuery mobile).Once user selects the items from ddb1,based on his selection I need to populate ddb2.I have used jQuery.change() in ddb1.But the issue I face is that onChange() is called every time the user selects/deselects an item from ddb1(I understand that this is the expected behavior) and not when the whole selection is over.

What I would like to do is - once ddb1 loses focus,I need to get all selected values from ddb1 and process it to populate ddb2.But I do not find an event which gets triggered when user is done with his selection from ddb1.I have tried ddb1.blur() and ddb2.focus().Doesnt help.Any thoughts on this?

Here goes the code:

<script type="text/javascript">
    $("#ddb1").blur(function(event) {
       $("#ddb2").empty(); 
       var ddb1_val = $("#ddb1 option:selected").val();


       var url = "construct url based on ddb1_val"

       $.getJSON(url,function(data) {
          //do something
       });
    });
</script>

Upvotes: 0

Views: 969

Answers (2)

Chris Pratt
Chris Pratt

Reputation: 239250

.blur() works as you would expect on select multiples. If it's not functioning for you, you must have some sort of error in your code.

If you post your code, someone might be able to help you, but for the moment, all I can say is that .blur() is the way to go.

Upvotes: 1

ShankarSangoli
ShankarSangoli

Reputation: 69905

You should basically have a button which will take all the selected options from dropdown1 and add it to dropdown2. Or you can add it right away on click of the option.

Upvotes: 1

Related Questions