下载地址:http://pan.baidu.com/s/1dE2daSD
1.Jquery多选下拉列表插件jquery multiselect功能介绍及使用
http://www.jb51.net/article/37323.htm
html
<div class="form-group"> <div class="col-md-6"> <label for="inputEmail3" class="col-md-3 control-label">客户:</label> <div class="col-md-9"> <select id="selectAgent" multiple='multiple' name="UR_Agent"> @{ for (int i = 0; i < AgentUserlist.Count; i++) { <option value='@AgentUserlist[i].UserName'>@AgentUserlist[i].UserName</option> } } </select> </div> </div> <!--排版占位--> <div class="col-md-6"> </div> </div>
js
@*下拉选项*@ <link rel="stylesheet" type="text/css" href="~/assets/mutiselect/multiselectSrc/jquery.multiselect.css" /> <link rel="stylesheet" type="text/css" href="~/assets/mutiselect/assets/style.css" /> <link rel="stylesheet" type="text/css" href="~/assets/mutiselect/assets/prettify.css" /> <link href="~/assets/mutiselect/assets/jquery-ui.css" rel="stylesheet" /> <script type="text/javascript" src="~/assets/mutiselect/ui/jquery.ui.core.js"></script> <script type="text/javascript" src="~/assets/mutiselect/ui/jquery.ui.widget.js"></script> <script type="text/javascript" src="~/assets/mutiselect/assets/prettify.js"></script> <script type="text/javascript" src="~/assets/mutiselect/multiselectSrc/jquery.multiselect.js"></script> <script type="text/javascript"> //绑定下拉列表 //绑定客户 $("#selectAgent").multiselect({ noneSelectedText: "==请选择==", checkAllText: "全选", uncheckAllText: '全不选', selectedList: 4, }); //初始化默认选中已有的选项,sceneIdList是要默认选中的值 var sceneIdList = "@Model.UR_Agent"; sceneIdArr = sceneIdList.split(","); $('#selectAgent option').each(function (i, content) { //alert(i+"***"+content.value); if ($.inArray($.trim(content.value), sceneIdArr) >= 0) { this.selected = true; } }); //设置选中值后,需要刷新select控件 $("#selectAgent").multiselect('refresh');