I have a javascript routine that is performing actions on a group of checkboxes, but the final action I want to set the clicked checkbox to checked or unchecked based on if the user was checking the box or unchecking.
Unfortunately, every time I check for whether it is being checked or unchecked, it returns "on" indicating the user is always checking the box! Any help would be appreciated, I've also included the javascript.
// Uncheck all the checkboxs with the same Tax Credit
for (i=0; i<arrChecks.length; i++)
{
var attribute = arrChecks[i].getAttribute("xid")
if (attribute == elementName)
{
// if the current state is checked, unchecked and vice-versa
if (arrChecks[i].value == "on") // <-- This is always returning true, even if the box is being unchecked
{
arrChecks[i].checked = 1;
} else {
arrChecks[i].checked = 0;
}
} else {
arrChecks[i].checked = 0;
}
}
This question is related to
javascript
You should be evaluating against the checked property of the checkbox element.
for (i=0; i<arrChecks.length; i++)
{
var attribute = arrChecks[i].getAttribute("xid")
if (attribute == elementName)
{
// if the current state is checked, unchecked and vice-versa
if (arrChecks[i].checked)
{
arrChecks[i].checked = false;
} else {
arrChecks[i].checked = true;
}
} else {
arrChecks[i].checked = false;
}
}
To toggle a checkbox or you can use
element.checked = !element.checked;
so you could use
if (attribute == elementName)
{
arrChecks[i].checked = !arrChecks[i].checked;
} else {
arrChecks[i].checked = false;
}
function CHeck(){
var ChkBox = document.getElementById("CheckBox1");
alert(ChkBox.Checked);
}
<asp:CheckBox ID="CheckBox1" runat="server" onclick="CHeck()" />
Also make sure you test it both in firefox and IE. There are some nasty bugs with JS manipulated checkboxes.
The value attribute of a checkbox is what you set by:
<input type='checkbox' name='test' value='1'>
So when someone checks that box, the server receives a variable named test with a value of 1 - what you want to check for is not the value of it (which will never change, whether it is checked or not) but the checked status of the checkbox.
So, if you replace this code:
if (arrChecks[i].value == "on")
{
arrChecks[i].checked = 1;
} else {
arrChecks[i].checked = 0;
}
With this:
arrChecks[i].checked = !arrChecks[i].checked;
It should work. You should use true and false instead of 0 and 1 for this.
I am not sure what the problem is, but I am pretty sure this will fix it.
for (i=0; i<arrChecks.length; i++)
{
var attribute = arrChecks[i].getAttribute("xid")
if (attribute == elementName)
{
if (arrChecks[i].checked == 0)
{
arrChecks[i].checked = 1;
} else {
arrChecks[i].checked = 0;
}
} else {
arrChecks[i].checked = 0;
}
}
function enter_comment(super_id) {
if (!(document.getElementById(super_id).checked)) {
alert('selected checkbox is unchecked now')
} else {
alert('selected checkbox is checked now');
}
}
<input type="checkbox" name="a" id="1" value="1" onclick="enter_comment(this.value)" />
<input type="checkbox" name="b" id="2" value="2" onclick="enter_comment(this.value)" />
function CHeck(){
var ChkBox = document.getElementById("CheckBox1");
alert(ChkBox.Checked);
}
<asp:CheckBox ID="CheckBox1" runat="server" onclick="CHeck()" />
I am not sure what the problem is, but I am pretty sure this will fix it.
for (i=0; i<arrChecks.length; i++)
{
var attribute = arrChecks[i].getAttribute("xid")
if (attribute == elementName)
{
if (arrChecks[i].checked == 0)
{
arrChecks[i].checked = 1;
} else {
arrChecks[i].checked = 0;
}
} else {
arrChecks[i].checked = 0;
}
}
function enter_comment(super_id) {
if (!(document.getElementById(super_id).checked)) {
alert('selected checkbox is unchecked now')
} else {
alert('selected checkbox is checked now');
}
}
<input type="checkbox" name="a" id="1" value="1" onclick="enter_comment(this.value)" />
<input type="checkbox" name="b" id="2" value="2" onclick="enter_comment(this.value)" />
Also make sure you test it both in firefox and IE. There are some nasty bugs with JS manipulated checkboxes.
The value attribute of a checkbox is what you set by:
<input type='checkbox' name='test' value='1'>
So when someone checks that box, the server receives a variable named test with a value of 1 - what you want to check for is not the value of it (which will never change, whether it is checked or not) but the checked status of the checkbox.
So, if you replace this code:
if (arrChecks[i].value == "on")
{
arrChecks[i].checked = 1;
} else {
arrChecks[i].checked = 0;
}
With this:
arrChecks[i].checked = !arrChecks[i].checked;
It should work. You should use true and false instead of 0 and 1 for this.
To toggle a checkbox or you can use
element.checked = !element.checked;
so you could use
if (attribute == elementName)
{
arrChecks[i].checked = !arrChecks[i].checked;
} else {
arrChecks[i].checked = false;
}
The value attribute of a checkbox is what you set by:
<input type='checkbox' name='test' value='1'>
So when someone checks that box, the server receives a variable named test with a value of 1 - what you want to check for is not the value of it (which will never change, whether it is checked or not) but the checked status of the checkbox.
So, if you replace this code:
if (arrChecks[i].value == "on")
{
arrChecks[i].checked = 1;
} else {
arrChecks[i].checked = 0;
}
With this:
arrChecks[i].checked = !arrChecks[i].checked;
It should work. You should use true and false instead of 0 and 1 for this.
To toggle a checkbox or you can use
element.checked = !element.checked;
so you could use
if (attribute == elementName)
{
arrChecks[i].checked = !arrChecks[i].checked;
} else {
arrChecks[i].checked = false;
}
I am not sure what the problem is, but I am pretty sure this will fix it.
for (i=0; i<arrChecks.length; i++)
{
var attribute = arrChecks[i].getAttribute("xid")
if (attribute == elementName)
{
if (arrChecks[i].checked == 0)
{
arrChecks[i].checked = 1;
} else {
arrChecks[i].checked = 0;
}
} else {
arrChecks[i].checked = 0;
}
}
Also make sure you test it both in firefox and IE. There are some nasty bugs with JS manipulated checkboxes.
I am not sure what the problem is, but I am pretty sure this will fix it.
for (i=0; i<arrChecks.length; i++)
{
var attribute = arrChecks[i].getAttribute("xid")
if (attribute == elementName)
{
if (arrChecks[i].checked == 0)
{
arrChecks[i].checked = 1;
} else {
arrChecks[i].checked = 0;
}
} else {
arrChecks[i].checked = 0;
}
}
Also make sure you test it both in firefox and IE. There are some nasty bugs with JS manipulated checkboxes.
To toggle a checkbox or you can use
element.checked = !element.checked;
so you could use
if (attribute == elementName)
{
arrChecks[i].checked = !arrChecks[i].checked;
} else {
arrChecks[i].checked = false;
}
Source: Stackoverflow.com