How To Create CheckBox in Dropdownlist in asp.net with code pls no links -
i want implement checkbox in dropdownlist using c# code , if possible want use checkbox in dropdownlist usercontrol please me guys.
you can create multiple checkbox inside dropdown using jquery bootstrap multi-select plugin
in order implement multiple select (multiselect) dropdownlist checkboxes in asp.net need make use of listbox control , apply jquery bootstrap multi-select plugin it.
download bootstrap , jquery bootstrap multi-select plugin download locations follows. bootstrap http://getbootstrap.com/
jquery bootstrap multi-select plugin need download plugin files following location. https://github.com/davidstutz/bootstrap-multiselect/ complete documentation can read on following page. http://davidstutz.github.io/bootstrap-multiselect/
html markup - html markup consists of asp.net listbox , button control.
<asp:listbox id="lstfruits" runat="server" selectionmode="multiple"> <asp:listitem text="mango" value="1" /> <asp:listitem text="apple" value="2" /> <asp:listitem text="banana" value="3" /> <asp:listitem text="guava" value="4" /> <asp:listitem text="orange" value="5" /> </asp:listbox> <asp:button text="submit" runat="server" onclick="submit" />
applying jquery bootstrap multi-select plugin listbox control first thing need inherit following javascript , css files. 1. jquery js file 2. bootstrap javascript , css files. 3. jquery bootstrap multi-select plugin javascript , css files. once files inherited need apply plugin listbox inside jquery document ready event handler.
the plugin supports various options, here making use of includeselectalloption adds select checkbox when specified , set true.
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script> <link href="http://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.0.3/css/bootstrap.min.css" rel="stylesheet" type="text/css" /> <script type="text/javascript" src="http://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.0.3/js/bootstrap.min.js"></script> <link href="http://cdn.rawgit.com/davidstutz/bootstrap-multiselect/master/dist/css/bootstrap-multiselect.css" rel="stylesheet" type="text/css" /> <script src="http://cdn.rawgit.com/davidstutz/bootstrap-multiselect/master/dist/js/bootstrap-multiselect.js" type="text/javascript"></script> <script type="text/javascript"> $(function () { $('[id*=lstfruits]').multiselect({ includeselectalloption: true }); }); </script> protected void submit(object sender, eventargs e) { string message = ""; foreach (listitem item in lstfruits.items) { if (item.selected) { message += item.text + " " + item.value + "\\n"; } } clientscript.registerclientscriptblock(this.gettype(), "alert", "alert('" + message + "');", true); }
for full source code go through link click here
Comments
Post a Comment