How to populate MultiSelect dropdown list (MVC) in Bootstrap

Question

I am struggling for populate the MultiSelect Dropdown list by Twitter Bootstrap library in MVC. I am getting the List of data on items in JSON string format. And passing to JSON.parse($('#RetailerSelectItems').val()) but list is not enable in web page. the code as below

Inside report.js

 function BinddetailsEvents() {
 //Populate Retailer Dropdown
 var MAWBSelectItems = JSON.parse($('#MAWBSelectItems').val()); // MAWBSelectItems List of data
 var MAWBDropDown = $('#MAWBDropDown');
 $(MAWBDropDown).data('allselected', true);
 MultiSelectInit(MAWBDropDown);
 $(MAWBDropDown).multiselect('dataprovider', MAWBSelectItems);
}

Inside report.cshtml

{
 <div>
 <label>MAWB</label><br />
 <select id="MAWBDropDown" multiple="multiple" style="display: none" data-allselected="true"></select>
 </div>
}

• Keppy: not sure but try to remove this line style="display: none"
• skt: Still its not working, Now just displaying drop down box. I am able to view the list of items in Model but its not populating in list.
• Keppy: here is one helpful link. Click here and change the ViewBag to your model
• skt: Thanks for reply but I would like to do with above method instead by view bag.
• Sam.C: you would have to populate the drop down list your self, the code $(MAWBDropDown).data('allselected', true); doesn't do anything in this context. loop through the items in the MAWBSelectItems and add them options to list. this might help : stackoverflow.com/questions/3446069/…