基于BootStrap multiselect.js實現的下拉框聯動效果

<script src="~/Assets/js/bootstrap-multiselect.min.js"></script>
 <link href="~/Assets/css/bootstrap-multiselect.css" rel="external nofollow" rel="stylesheet" />

 function RegSelect() {
 $('.multiselect').multiselect({
 buttonClass: 'btn btn-white ',
 enableFiltering: true,
 enableHTML: true,
 includeSelectAllOption: true,
 selectAllText: '全選',
 allSelectedText: '全部選中',
 nonSelectedText: '請選擇',
 nSelectedText: '個被選中',
 templates: {
 button: '<button type="button" class="multiselect dropdown-toggle" data-toggle="dropdown"><span class="multiselect-selected-text"></span>  <b class="fa fa-caret-down"></b></button>',
 ul: '<ul class="multiselect-container dropdown-menu"></ul>',
 filter: '<li class="multiselect-item filter"><div class="input-group"><span class="input-group-addon"><i class="fa fa-search"></i></span><input class="form-control multiselect-search" type="text"></div></li>',
 filterClearBtn: '<span class="input-group-btn"><button class="btn btn-default btn-white btn-grey multiselect-clear-filter" type="button"><i class="fa fa-times-circle red2"></i></button></span>',
 li: '<li><a tabindex="0"><label></label></a></li>',
 divider: '<li class="multiselect-item divider"></li>',
 liGroup: '<li class="multiselect-item multiselect-group"><label></label></li>'
 }
 });
 }

 <div class="form-group">
 <label for="RepairOrg" class="col-sm-3 control-label">維修單位</label>
 <div class="col-sm-9">
 @Html.DropDownList("RepairOrgUID", ViewBag.OrgList as List<SelectListItem>, "請選擇", new { @class = "form-control multiselect", onchange = "OrgChange(this)", id = "RepairOrg" })
 </div>
 </div>
 <div class="form-group">
 <label for="RepairContact" class="col-sm-3 control-label">維修人</label>
 <div class="col-sm-9">
 @Html.DropDownList("RepairContactUID", ViewBag.ContactList as List<SelectListItem>, "請選擇", new { @class = "form-control multiselect", id = "RepairContact" })
 </div>
 </div>

function OrgChange(obj, patientID) {
 var RepairOrg = $(obj).val();
 $.post("/TerminalManage/GetContactByOrg", { RepairOrg: RepairOrg }, function (data) { 
 var newCitys = new Array();
 var obj = new Object();
 obj = {
 label: "請選擇",
 value: ""
 };
 newCitys.push(obj);
 for (var i = 0; i < data.length; i++) {
 obj = {
 label: data[i].Text,
 value: data[i].Value
 };
 newCitys.push(obj);
 }
 $("#RepairContact").multiselect('dataprovider', newCitys);
 $('#RepairContact').multiselect('refresh');
 });
 }