Set values in jquery multiselect dropdown

Question

I want to set the multiple ITEMS in jQuery multiselect dropdown depending on the VALUE of that item, which I'm getting from database, separated by ",".

I'm saving this fetched data in hidden field.

Ex.

Hidden field: hdnLots = 64,65 , Items for lot No.: 64 = Lot 1, 65 = Lot2

So when I get the hdnLot=65, then in jQuery Multiselect dropdown only Lot2 needed to be selected. And same for 64,65. i.e. When multiple values are selected than all those values needed to seleted.

I've tried: JQuery multiselect - Set a value as selected in the multiselect dropdown

Code I've wrote for this is:

if ($("#<%= btnUpdateProject.ClientId %>").css('display') == "inline-block") 
{
   debugger;
   var dataarray = document.getElementById('<%= hdnLots.ClientId %>').value.split(",");
   $("#<%= ddlNoOfLots.clientid %>").val(dataarray);
}

add `$("#<%= ddlNoOfLots.clientid %>").multiselect("refresh");` — Dharmang, Jan 04 '14 at 04:57
@Dharmang : I've tried it, but its changing `size(height,width)` of multiselect and neither its working. — I Love Stackoverflow, Jan 04 '14 at 05:01
@Nouphal.M : `Uncaught type error: Object [object object] has no method refresh`. — I Love Stackoverflow, Jan 04 '14 at 05:02
Sorry but $("#<%= ddlNoOfLots.clientid %>").multiselect('refresh'); is the right syntax. Also have you checked what is the value of the `dataarray` var — Nouphal.M, Jan 04 '14 at 05:04
@Nouphal.M : It's showing only the single data in `dataarray`. i.e. `dataarray = 65` only, even if `hdnLots=64,65`. — I Love Stackoverflow, Jan 04 '14 at 05:09
@Dharmang: I'll try for that, but I don't think so I can do that because I'm new to this. — I Love Stackoverflow, Jan 04 '14 at 05:12
You need use third party service like jsfiddle to demonstrate your code in js and html language, if you don't know already. — Dharmang, Jan 04 '14 at 05:14
Try alerting document.getElementById('<%= hdnLots.ClientId %>').value and see what it holds — Nouphal.M, Jan 04 '14 at 05:18
@Dharmang: Somehow I managed to reach upto refresh method but its still showing this error: **`Uncaught Error: Cannot call methods on multiselect prior to initialization, attempt to call method 'refresh'`** in console. — I Love Stackoverflow, Jan 04 '14 at 05:21
This error means that your multiselect instance is not initialized. first initialize it by calling $("#<%= ddlNoOfLots.clientid %>").multiselect(); provide any options if necessary. — Dharmang, Jan 04 '14 at 05:35

Dharmang · Accepted Answer · 2018-05-31T11:36:51.843

I hope this will help you:

Demo

$(document).ready(function() {
$("select").multiselect({
   selectedText: "# of # selected"
});
var hidValue = $("#hidSelectedOptions").val();
alert(hidValue);
var selectedOptions = hidValue.split(",");
for(var i in selectedOptions) {
    var optionVal = selectedOptions[i];
    $("select").find("option[value="+optionVal+"]").prop("selected", "selected");
}
$("select").multiselect('reload');
});

EDIT

refresh has been removed from latest jQuery-MultiSelect. Using reload will solve the question now.

score 6 · Answer 2 · answered Jun 14 '16 at 02:04

6

The one thing you would need to ensure is that the values in the array are strings:

<select id='multipleSelect' multiple='multiple'>
  <option value="1">1</option>
  <option value="2">2</option>
  <option value="3">3</option>
</select>
<script type='text/javascript'>
    $('#multipleSelect').val(['1', '2']);
</script>

Check my Fiddle: https://jsfiddle.net/luthrayatin/jaLygLzo/

answered Jun 14 '16 at 02:04

Yatin

1,178
11
15

I'm glad I could help mate! – Yatin May 18 '17 at 21:47

score 4 · Answer 3 · answered Sep 27 '17 at 23:18

4

var selectedOptions = hidValue.split(",");
typeof (selectedOptions != 'undefined' && $("#hidSelectedOptions").multiselect('select', selectedOptions));

answered Sep 27 '17 at 23:18

Subha

303
2
9

.multiselect('select', selectedOptions)); this part works great for me. – SarangK Jun 18 '19 at 18:28

Set values in jquery multiselect dropdown

3 Answers3

Linked