Home/ Questions/Q 8421451
In Process

The Archive Base Latest Questions

Editorial Team
  • 0
Asked: 2026-06-10T03:09:15+00:00

I have two separate forms on the page and both of them have a

  • 0

I have two separate forms on the page and both of them have a group of checkboxes.

<body>
   <form name="form1" id="form1" ...>
        <input type="checkbox" name="check1" value="Person"  />
        <input type="checkbox" name="check1" value="Dog"  />
        <input type="checkbox" name="check1" value="Cat"  />
   </form>
    <form name="form2" id="form2" ...>
        <input type="checkbox" name="check1" value="Person"  />
        <input type="checkbox" name="check1" value="Dog"  />
        <input type="checkbox" name="check1" value="Cat"  />
      </form>
  </body>

What I need here is, once the user check/unchecks any checkbox in form2, I want to do the same for corresponding checkbox in form1. If the user selects “dog” and “cat” in form2, check the same for form1 automatically. I have tried a couple of things but I can’t figure out a way to set checked attribute based on the value field.

Best I could to do is to have unique ids for all checkboxes and select/unselect based on ids. But I am trying to find out if there is a better selector way.

Also, I will be glad if anyone can suggest me a better way to do what I am trying here.

— I haven’t tried this yet, but this is what I was planning to do—

   <form name="form1" id="form1" ...>
        <input type="checkbox" name="check1[]" id="form1_Person" value="Person"  />
        <input type="checkbox" name="check1[]" id="form1_Dog" value="Dog"  />
        <input type="checkbox" name="check1[]" id="form1_Cat" value="Cat"  />
   </form>
    <form name="form2" id="form2" ...>
        <input type="checkbox" name="check1[]" id="form2_Person" value="Person"  />
        <input type="checkbox" name="check1[]" id="form2_Person" value="Dog"  />
        <input type="checkbox" name="check1[]" id="form2_Person" value="Cat"  />
      </form>

once form2 checkbox is clicked, get the value, and look for checkbox in form1. If dog is selected, check $(‘#form1_'[dog]).checked(‘checked’,checked)

Share

Leave an answer

You must login to add an answer.

Need An Account,

1 Answer

  1. Editorial Team

    You can do this

    $('input[type=checkbox]').change(function(){ // <-- bind to all checkboxes
    var $this = $(this);
    var x = $this.index();  // store index
    var $otherForm = $('form').not($this.parent()); // need this to synch other form
    $otherForm.find('input').eq(x).prop('checked',this.checked); // change other forms checkbox accordingly
});​

    http://jsfiddle.net/wirey00/ewfrV/

    • 0