Question

Trying to set a checkbox inside a table. I thought it would be straightforward and similar to doing it in a form.

I can do this successfully with a form , but getting stuck when the checkbox is in a table.

When the checkbox is in a form I use:

 <form name="access_menu_form">
    <input type="checkbox" name="mybox_name" id="mybox_id" value="1">
 </form>

 document.access_menu_form.mybox_name.checked == true

Which works great!!

I know I am missing a key point about the DOM. Trying to set a checkbox that I have in table fails using a similar technique which fails:

My table:

 <table name="access_table">
   <thead>
    <tr>
      <th>Area</th> 
      <th>Item</th> 
      <th>Access</th> 
    </tr>
  </thead>
 <tr>
   <td><input type="checkbox" name="mybox_name" id="mybox_id" value="1"></td>
   <td><input type="checkbox" name="mybox1_name" id="mybox1_id" value="1"></td>
   <td></td>
 </tr>
 </table>

My script

 document.access_table.mybox_name.checked = false;

I get the error: Uncaught TypeError: Cannot read property ‘mybox’ of undefined

 document.mybox_name.checked = false;

I get the error: Uncaught TypeError: Cannot set property ‘checked’ of undefined

Answer 1

• Use the ‘checked’ attribute
• let javascript find the checkbox using the following, document.getElementById(‘mybox_id’)