首页 > 代码库 > JQuery Plugin serials (1)--- Harvest Chosen

JQuery Plugin serials (1)--- Harvest Chosen

一、Download harvest chosen from github

https://github.com/harvesthq/chosen/

二、在页面引用

@using (Html.BeginForm()){    <fieldset>        <legend>Multi-Select Demo</legend>        <div class="editor-field">            @Html.ListBox("Countries", ViewBag.Countrieslist as MultiSelectList                , new                {                    @class = "chzn-select",                    data_placeholder = "Choose  Countries..."                })            <p>                <input type="submit" value=http://www.mamicode.com/"Save" />            </p>        </div>    </fieldset>}<script src=http://www.mamicode.com/"@Url.Content("~/Scripts/chosen.jquery.js")"></script><link href=http://www.mamicode.com/"@Url.Content("~/Content/chosen.css")" rel="stylesheet" type="text/css" /><script>    $(".chzn-select").chosen();</script>
View Code


三、Controller code

 

 [HttpGet]        public ActionResult MultiSelectCountries()        {            ViewBag.Countrieslist = GetCountries(new string[] { "1","2" });            return View();        }        [HttpPost]        public ActionResult MultiSelectCountries(FormCollection form)        {            ViewBag.YouSelected = form["Countries"];            string selected = form["Countries"];            ViewBag.Countrieslist = GetCountries(selected.Split(,));            return View();        }        private MultiSelectList GetCountries(string[] selectedValues)        {            List<Country> countries = new List<Country>            {                  new Country() { Id = 1, Name= "United States" },                    new Country() { Id = 2, Name= "Canada" },                    new Country() { Id = 3, Name= "UK" },                    new Country() { Id = 4, Name= "China" },                    new Country() { Id = 5, Name= "Japan" }            };            return new MultiSelectList(countries, "Id", "Name", selectedValues);        }
View Code

 

JQuery Plugin serials (1)--- Harvest Chosen