ASPForums.Net RSS Feedhttp://www.aspforums.net/Handlers/RSS.ashxLatest additions to the content that appears on ASPForums.Net(c) 2019 www.aspforums.com. All rights reserved.Bootstrap Style CheckBoxList in ASP.Net using jQuery<p>Hi <a class="username" rel="Prasunjeet"> Prasunjeet</a>,</p> <p>I have created sample using below link.</p> <p><a href="https://github.com/flatlogic/awesome-bootstrap-checkbox">https://github.com/flatlogic/awesome-bootstrap-checkbox</a></p> <p><span style="text-decoration: underline;">HTML</span></p> <div class="demo_block"> <pre class="brush: html">&lt;html xmlns=&#34;http://www.w3.org/1999/xhtml&#34;&gt; &lt;head runat=&#34;server&#34;&gt; &lt;title&gt;&lt;/title&gt; &lt;link rel=&#34;stylesheet&#34; href=&#34;http://maxcdn.bootstrapcdn.com/bootstrap/3.3.2/css/bootstrap.min.css&#34; /&gt; &lt;link href=&#34;http://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.0.3/css/font-awesome.css&#34; rel=&#34;stylesheet&#34; type=&#34;text/css&#34; /&gt; &lt;style type=&#34;text/css&#34;&gt; .checkbox { padding-left: 20px; } .checkbox label { display: inline-block; vertical-align: middle; position: relative; padding-left: 5px; } .checkbox label::before { content: &#34;&#34;; display: inline-block; position: absolute; width: 17px; height: 17px; left: 0; margin-left: -20px; border: 1px solid #cccccc; border-radius: 3px; background-color: #fff; -webkit-transition: border 0.15s ease-in-out, color 0.15s ease-in-out; -o-transition: border 0.15s ease-in-out, color 0.15s ease-in-out; transition: border 0.15s ease-in-out, color 0.15s ease-in-out; } .checkbox label::after { display: inline-block; position: absolute; width: 16px; height: 16px; left: 0; top: 0; margin-left: -20px; padding-left: 3px; padding-top: 1px; font-size: 11px; color: #555555; } .checkbox input[type=&#34;checkbox&#34;] { opacity: 0; z-index: 1; } .checkbox input[type=&#34;checkbox&#34;]:checked + label::after { font-family: &#34;FontAwesome&#34;; content: &#34;\f00c&#34;; } .checkbox-primary input[type=&#34;checkbox&#34;]:checked + label::before { background-color: #337ab7; border-color: #337ab7; } .checkbox-primary input[type=&#34;checkbox&#34;]:checked + label::after { color: #fff; } &lt;/style&gt; &lt;/head&gt; &lt;body&gt; &lt;form id=&#34;form1&#34; runat=&#34;server&#34;&gt; &lt;div class=&#34;checkbox checkbox-primary&#34;&gt; &lt;table id=&#34;cblItem&#34; class=&#34;styled&#34;&gt; &lt;tr&gt; &lt;td&gt; &lt;input id=&#34;cblItem_0&#34; type=&#34;checkbox&#34; name=&#34;cblItem$0&#34; checked=&#34;checked&#34; value=&#34;Item A&#34; /&gt;&lt;label for=&#34;cblItem_0&#34;&gt;Item A&lt;/label&gt; &lt;/td&gt; &lt;/tr&gt; &lt;tr&gt; &lt;td&gt; &lt;input id=&#34;cblItem_1&#34; type=&#34;checkbox&#34; name=&#34;cblItem$1&#34; value=&#34;Item B&#34; /&gt;&lt;label for=&#34;cblItem_1&#34;&gt;Item B&lt;/label&gt; &lt;/td&gt; &lt;/tr&gt; &lt;tr&gt; &lt;td&gt; &lt;input id=&#34;cblItem_2&#34; type=&#34;checkbox&#34; name=&#34;cblItem$2&#34; value=&#34;Item C&#34; /&gt;&lt;label for=&#34;cblItem_2&#34;&gt;Item C&lt;/label&gt; &lt;/td&gt; &lt;/tr&gt; &lt;/table&gt; &lt;/div&gt; &lt;/form&gt; &lt;/body&gt; &lt;/html&gt;</pre> <a class="demo button orange btn btn-red">Demo</a></div> <div class="demo_block">&nbsp;</div> <div class="demo_block">Please use below HTML div if using asp.net control</div> <div class="demo_block">&nbsp;</div> <pre class="brush: html">&lt;div class=&#34;checkbox checkbox-primary&#34;&gt; &lt;asp:CheckBoxList runat=&#34;server&#34; ID=&#34;cblItem&#34; CssClass=&#34;styled&#34;&gt; &lt;asp:ListItem Text=&#34;Item A&#34; Selected=&#34;True&#34; /&gt; &lt;asp:ListItem Text=&#34;Item B&#34; /&gt; &lt;asp:ListItem Text=&#34;Item C&#34; /&gt; &lt;/asp:CheckBoxList&gt; &lt;/div&gt;</pre>https://www.aspforums.net:443/Threads/165061/Bootstrap-Style-CheckBoxList-in-ASPNet-using-jQuery/https://www.aspforums.net:443/Threads/165061/Bootstrap-Style-CheckBoxList-in-ASPNet-using-jQuery/Fri, 04 Dec 2015 06:20:51 GMT