Check box select/unselect for boxes in a fieldset

Collapse
X
 
  • Time
  • Show
Clear All
new posts
  • jmartmem
    New Member
    • Feb 2008
    • 87

    Check box select/unselect for boxes in a fieldset

    Greetings,

    I have an ASP page containing a Record Insertion Form with a number of fields linked to an Access database. Within this form, I have a fieldset with six checkboxes, one of which is a "Select ALL" checkbox that selects or unselects all checkboxes in the fieldset.

    My problem is that when I select the "Select ALL" checkbox, it selects every checkbox in the form, not just those in the fieldset.

    Here is the code for the "Select ALL" checkbox:

    <td><input type="checkbox" name="PIC_RgnIm pact_SelectALL" "value="1" onclick='RgnChe ckedAll(form1); '/></td>

    Here is the Javascript for the function:

    <script language=javasc ript>

    checked=false;
    function RgnCheckedAll (form1) {
    var aa= document.getEle mentById('form1 ');
    if (checked == false)
    {
    checked = true
    }
    else
    {
    checked = false
    }
    for (var i =0; i < aa.elements.len gth; i++)
    {
    aa.elements[i].checked = checked;
    }
    }
    </script>

    I'm relatively new to Javascript and am unsure how to code the form to capture only the checkboxes in my fieldset.

    Whatever advice anyone has would be much appreciated.

    - JM
  • pronerd
    Recognized Expert Contributor
    • Nov 2006
    • 392

    #2
    Hi,

    Welcome to the forum. You may find you will get more responses if you use code tags when posting code. It is much harder to read posted code without them.


    Originally posted by jmartmem
    it selects every checkbox in the form, not just those in the fieldset.
    I am not clear on what is meant by "fieldset". How are those check boxes differentiated? Since the loop goes though every field in the form it is going to effect all of them.

    You could either start your loop from an element that surrounds this set of check boxes, or use specific values in one of the attributes that you can test in the loop.

    Example :
    [HTML]
    <form>
    <input type="checkbox" id="field1Set1 " />
    <input type="checkbox" id="field2Set1 " />
    <input type="checkbox" id="field3Set1 " />
    <input type="checkbox" id="field1Set2 " />
    <input type="checkbox" id="field2Set2 " />
    <input type="checkbox" id="field3Set2 " />
    <input type="checkbox" id="field1Set3 " />
    <input type="checkbox" id="field2Set3 " />
    <input type="checkbox" id="field3Set3 " />
    </form>

    [/HTML]

    Comment

    • jmartmem
      New Member
      • Feb 2008
      • 87

      #3
      Thanks for the suggestion about the code tags. I'd wondered how everyone posted their code in that way and I now know how to do it.

      As for the fieldset, it is as a form element in the Dreamweaver CS3 software package that surrounds a set of checkboxes. Here's an example of my fieldset code (the checkboxes are in a table within the element):

      Code:
      <fieldset>
                  <legend>FedEx Regions</legend>
                  <table width="247">
                    <tr>
                      <td width="22"><input type="checkbox" name="PIC_RgnImpact_US" value="1" /></td>
                      <td width="82"><span class="style47">US</span></td>
                      <td width="20"><input type="checkbox" name="PIC_RgnImpact_APAC" value="1" /></td>
                      <td width="103"><span class="style47">APAC</span></td>
                    </tr>
                    <tr>
                      <td><input type="checkbox" name="PIC_RgnImpact_CAN" value="1" /></td>
                      <td><span class="style47">CAN</span></td>
                      <td><input name="PIC_RgnImpact_LAC" type="checkbox" value="1" /></td>
                      <td><span class="style47">LAC</span></td>
                    </tr>
                    <tr>
                      <td><input type="checkbox" name="PIC_RgnImpact_EMEA" value="1" /></td>
                      <td><span class="style47">EMEA</span></td>
                      <td><input type="checkbox" name="PIC_RgnImpact_SelectALL" "value="1" onclick='RgnCheckedAll(form1);'/></td>
                      <td><span class="style50">Select ALL</span></td>
                    </tr>
                  </table>
                  </fieldset>
      Back to your example of giving each a specific value ID (e.g., id=field1set1), how do you suggest I incorporate that into my function? Here again is the function code (this time wrapped by CODE tags):

      Code:
      <script language=javascript>
      
      checked=false;
      function RgnCheckedAll (form1) {
      	var aa= document.getElementById('form1');
      	 if (checked == false)
                {
                 checked = true
                }
              else
                {
                checked = false
                }
      	for (var i =0; i < aa.elements.length; i++) 
      	{
      	 aa.elements[i].checked = checked;
      	}
            }
      </script>

      Comment

      • pronerd
        Recognized Expert Contributor
        • Nov 2006
        • 392

        #4
        Code:
        <script language=javascript>
        
        checked=false;
            function RgnCheckedAll (form1, setName) {
                var aa= document.getElementById('form1');
                if (checked == false)  {
                    checked = true
                } else {
                    checked = false
                }
                
                for (var i =0; i < aa.elements.length; i++) {
                    var formElement = aa.elements[i];
                    if(formElement.indexOf(setName) > -1 ) {
        	        aa.elements[i].checked = checked;
                    }
        	}
              }
        </script>

        Comment

        Working...