Select2使用实例

1、List<Product> ProductList = ViewBag.ProductList as List<Product>; 

2、样式

　　<link href="~/Content/assets/global/plugins/select2/css/select2.min.css" rel="stylesheet" />

　　<link href="~/Content/assets/global/plugins/select2/css/select2-bootstrap.min.css" rel="stylesheet" />

3、html　

<select tabindex="1" style="width:360px;" id="ProductIDs" name="ProductIDs" multiple="multiple">@foreach (var item in ProductList){<option value="@item.ProductID">@item.ShortName</option>}</select>

View Code

4、js引入及脚本

<script src="~/Content/assets/global/plugins/select2/js/select2.full.js"></script>
<script src="~/Content/assets/global/plugins/select2/js/select2.min.js"></script>

 $(function () {            $("select").select2();            var ProductIDs = new Array(@string.Join(",",m.ProductIDs));//绑定数据            if (ProductIDs.length > 0) {                $("#ProductIDs").select2('val', ProductIDs);            }}var dataValues = jQuery("#thisForm").serialize();//序列化/

5、对象字段接收

class{public List<int> ProductIDs {get;set;}}