Question

I am using javascript to make unchecked GridView .
But whenever I try, I cannot make unchecked it.

function UncheckedItemsCheckBox(CheckboxID) {
      var checkbox = document.getElementById(CheckboxID);
      checkbox.checked = false;            
      alert(checkbox.id + " : " + checkbox.name + " : " + checkbox.checked);
}

Here is the output.

---------------------------
Message from webpage
---------------------------
GridView1_ctl02_txtDoseQty : GridView1$ctl02$txtDoseQty : false
---------------------------
OK   
---------------------------

Even though “checkbox.checked” return me “false” as output message shown, but at the gridview checkbox is still checked.

Could anyone please give me suggestion?

Answer 1

What may be happening is that your CheckBoxID is wrong, and therefore returning the wrong element.

In JavaScript, saying checkbox.checked = false; will, if this object did not previously have a checked property, add one to the object, with the value provided. So, if your CheckBoxID is in fact wrong, it’s no surprise your alert shows false; any non-null element you pull back with getElementById will allow you to add a checked property to it.

More specifically, in asp.net when you create a checkbox column, like this

<asp:CheckBoxField Text="Hello" DataField="foo" />

it renders html like this:

<span class="aspNetDisabled">
    <input id="gv_ctl00_0" type="checkbox" name="gv$ctl02$ctl00" disabled="disabled">
    <label for="gv_ctl00_0">Hello</label>
</span>

A couple possibilities:

1. The id you’re getting may be of the span, on which you’re adding a checked property.
2. You’re setting the checkbox to be checked, but since it’s disabled, it’s not updating its state — ok, it looks like disabled checkboxes can have their checked properties updated. Hopefully #1 is your problem.

A good place to start debugging would be to change your function to this

function UncheckedItemsCheckBox(CheckboxID) {
      var checkbox = document.getElementById(CheckboxID);

      alert(checkbox.checked);  // <------- should display false, but will 
                                // display undefined if this element is 
                                // something other than a checkbox

      checkbox.checked = false;            
      alert(checkbox.id + " : " + checkbox.name + " : " + checkbox.checked);
}