Databases
StackOverflow2013
Postsdbo
POToggling checkboxlist item using Javascript
Body
 

Note that there are some explanatory texts on larger screens.

plurals
  1. POToggling checkboxlist item using Javascript
    text
    copied!<p>I have a checkboxlist with two items. I am having a hard time toggling between the two checkboxlist items using JavaScript. I would like to click on one and if the other is already checked, the check mark should go away. Following is the markup for the checkboxlist.</p> <pre><code>&lt;asp:CheckBoxList ID="chkApplyLimits" runat="server" RepeatColumns="2" ClientIDMode="Static" onclick="CheckBoxToggle"&gt; &lt;asp:ListItem Text="Yes" Value="1"&gt;&lt;/asp:ListItem&gt; &lt;asp:ListItem Text="No" Value="0"&gt;&lt;/asp:ListItem&gt; &lt;/asp:CheckBoxList&gt; </code></pre> <p>I am using the following JavaScript function to enable the toggle. In the JavaScript, I am essentially getting all the child elements of the parent and then looping through them to set the checked property false for all of the child elements. Finally, I am making the checked property of the item clicked to true.</p> <pre><code> function CheckBoxToggle(event) { if (event.srcElement.type == 'checkbox') { var childNodes = event.srcElement.parentNode.childNodes; for (var i = 0; i &lt; childNodes.length; i++) { childNodes[i].setAttribute("checked", false); } event.srcElement.checked = true; } } </code></pre> <p>This works fine if nothing is checked at the beginning. However, when I click the second time both checkboxes become checked. Can someone please instruct how i can change this so that if one checkbox is already clicked, it will become unchecked when i click the second checkbox.</p> <p>Any help is appreciated.</p>
 

Querying!

 
Guidance
An individual column

Larger individual text columns get their own page to allow for proper reading.

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload