• Status: Solved
  • Priority: Medium
  • Security: Public
  • Views: 1704
  • Last Modified:

Click table row to select checkbox

Hi,

I've seen this done before and now I'm curious on how to do it.

DESCRIPTION OF WHAT I'M TRYING TO DO
The user clicks anywhere on the table row and the checkbox is selected in that row as well.

PROBLEM
I wrote a function to do the work but it looks as if the form object is just coming back as an object and not the actual name.  I have little doubt of where my problem is, I just don't know how to fix it.

EXISTING CODE

Keep in mind that I am using PHP to automatically generate the id number of each field.  I'm going to hardcode it for these purposes so just don't get thrown off there = )

<script type="text/javascript">
  function SubSiteMsgChecks(obj) {
    if (document.SubSite_Form.obj.checked) {
      document.SubSite_Form.obj.checked=false;
    } else {
      document.SubSite_Form.obj.checked=true;
    }
  }
</script>

<table>
  <tr onclick="SubSiteMsgChecks(\'SubSite_Msg1\');">
    <td><input type="checkbox" name="SubSite_Msg1" /></td>
  </tr>
  <tr onclick="SubSiteMsgChecks(\'SubSite_Msg2\');">
    <td><input type="checkbox" name="SubSite_Msg2" /></td>
  </tr>
</table>

I think that's a good place to start for the purpose of these boards.  Thanks in advance!
0
gijew
Asked:
gijew
  • 3
1 Solution
 
Pravin AsarCommented:
Following should work for you.

<script type="text/javascript">
  function SubSiteMsgChecks(objName) {
    var obj = eval ('document.SubSite_Form.'+objName);
    if (!obj) { return; }
    if (obj.checked) { obj.checked=false; }
    else                  { obj.checked=true; }
  }
</script>

<tr onclick="SubSiteMsgChecks('SubSite_Msg1');">
0
 
Pravin AsarCommented:
If you have only one cell in a table ( as per your post), we do not any javascript.

Use label  as shown below. Click on label text , will check/uncheck the box.

<table>
  <tr>
       <td>
            <label for="SubSite_Msg1">
            <input id="SubSite_Msg1" type="checkbox" name="SubSite_Msg1">
             Hello Click Here
            </label>
        </td>
  </tr>

  <tr onclick="SubSiteMsgChecks('SubSite_Msg2');">
    <td><input type="checkbox" name="SubSite_Msg2" /></td>
  </tr>
</table>
0
 
gijewAuthor Commented:
That worked out nicely.  I do have more than one cell in each table though.  Still, the first example fits what I'm doing perfectly.

Thanks again!
0
 
Pravin AsarCommented:
Thanks,

Following should work for multi -cell situation.

<table>
  <label for="SubSite_Msg1">
     <tr>
     <td><input id="SubSite_Msg1" type="checkbox" name="SubSite_Msg1">Hello Click Here</td>
     <td>One more cell</td>
  </tr>
  </label>
  <tr onclick="SubSiteMsgChecks('SubSite_Msg2');">
    <td><input type="checkbox" name="SubSite_Msg2" /></td>
  </tr>
</table>
0

Featured Post

Concerto's Cloud Advisory Services

Want to avoid the missteps to gaining all the benefits of the cloud? Learn more about the different assessment options from our Cloud Advisory team.

  • 3
Tackle projects and never again get stuck behind a technical roadblock.
Join Now