The example of this article for everyone to share the Jquery.multiselect drop-down box implementation method for your reference, the specific contents are as follows
The first step: link The following files, if not, to download https://github.com/ehynds/jquery-ui-multiselect-widget This page, this plugin is based on jquery, So all of the basic jquery files need to be referenced
<link rel= "stylesheet" type= "Text/css" href= "~/scripts/jquerymultiselect/jquery-ui.css"/> <link "rel="
Stylesheet "type=" Text/css "href=" ~/scripts/jquerymultiselect/jquery.multiselect.css "/> <link rel=
" Stylesheet "type=" Text/css "href=" ~/scripts/jquerymultiselect/style.css "/> <link rel=" stylesheet "type="
Text/css "href=" ~/scripts/jquerymultiselect/prettify.css "/> <script type=" Text/javascript "src=" ~/
Scripts/jquery-ui-1.8.24.min.js "></script>
<script type=" Text/javascript "src=" ~/scripts/ Jquerymultiselect/prettify.js "></script>
<script type=" Text/javascript "src=" ~/scripts/ Jquerymultiselect/jquery.multiselect.min.js "></script>
Step Two: define HTML code
<select name= "Users" multiple= "multiple" id= "Select_users" >
@foreach (DModel.Model.User item in Viewbag.users)
{
if (Model.Users.Contains) (item. Name)
{
<option value= "@item. Name "Selected=" selected > @item. Name</option>
}
else
{
<option value= "@item. Name > @item. Name</option>
}
}
</select>
Step three: load plugin rendering
<script>
$ (function () {
$ ("#select_users"). MultiSelect ({
noneselectedtext: "= = Please choose = =",
Checkalltext: "Select All",
Uncheckalltext: ' All not selected ',
selectedlist:5
});
</script>
Fourth Step: Refresh Page view effect
So far, basically finished. The next step is to take the value and assign the value.
Value: $ ("#select_users"). Val (); Returns an array. Because I'm using the Ajax.beginform front page, so I don't need to take a value.
Assignment: The assignment was implemented in the second step, and no other assignment was found.
The above is the entire content of this article, I hope to help you learn, but also hope that we support the cloud habitat community.