Bootstrap Switch in Datagrid

Question

Im rendering a Datagrid in ASP.Net VB, I want to incorporate Bootstrap switch, but can only target one row

HTML:

<asp:TemplateColumn HeaderText="Allow text" ItemStyle-Width="1px" HeaderStyle-Width="1px">
   <ItemTemplate>
       <asp:CheckBox ID="cbtxt" runat="server" Checked='<%# Container.DataItem("allowtxt")%>'/>
   </ItemTemplate>          
</asp:TemplateColumn>

JQUERY:

$("[id='ContentPlaceHolder1_dgNames_cbtxt_1']").bootstrapSwitch();

I could only get one working by accessing the chrome developer console, when i tried dropping the "1" at the end, it didnt work, it only work if i have the full ID, and nothing more. Is there a way around this?!

Display enter image description here

Console enter image description here

Maybe you could add a class to the checkbox, and use that as the JQuery selector? e.g. `` then `$(".switch").bootstrapSwitch()`. However, it [looks like](http://stackoverflow.com/a/10179895/2278086) `CssClass` on `CheckBox` may create a wrapped `span` with the `class` set, so perhaps you would need `$("span.switch > input").bootstrapSwitch()`. — Mark, Jul 14 '15 at 17:04
@Mark thanks for you response, and the link to the answer, appreciated. — Johnn5er, Jul 15 '15 at 08:59

score 0 · Answer 1 · answered Jul 15 '15 at 09:05

The answer to my question can be found over here . The class i added to the <asp:checkbox> wasnt being picked up when the page rendered. So in reference to @Mark and the link above, i simply added a class to the checkbox through JQuery, before i initialized Bootstrap Switch:

$("input[type=checkbox]").addClass("switch");
    $(".switch").bootstrapSwitch();

Bootstrap Switch in Datagrid

1 Answers1