Question

I’m new to PHP and Javascript, and just starting a website that will have two forms, one form with 5 checkboxes, and one with 5 radiobuttons. When you change the radiobuttons selected radiobutton it refreshes the page and uses the new value. The same with the checkboxes. Unfortunately, if you change one of the forms, and then change another form, the 1st forms value will no longer be there.

Here’s the code:

<form name='form2' method='post'>
           <input type="radio" name="group1" value="all" onClick="if (this.checked) this.form.submit();" <?php if ($_REQUEST['group1'] == null || $_REQUEST['group1'] == "all"){ echo "checked='checked'";}?>/> All<br>
           <input type="radio" name="group1" value="Example" onClick="if (this.checked) this.form.submit();" <?php if ($_REQUEST['group1'] == "Example"){ echo "checked='checked'";}?>/> Example<br>
           <input type="radio" name="group1" value="clifton" onClick="if (this.checked) this.form.submit();" <?php if ($_REQUEST['group1'] == "clifton"){ echo "checked='checked'";}?>/> Clifton<br/>
           <input type="radio" name="group1" value="fruita" onClick="if (this.checked) this.form.submit();" <?php if ($_REQUEST['group1'] == "fruita"){ echo "checked='checked'";}?>/> Fruita<br/>
           <input type="radio" name="group1" value="loma" onClick="if (this.checked) this.form.submit();" <?php if ($_REQUEST['group1'] == "loma"){ echo "checked='checked'";}?>/> Loma<br/>
       </form>


       <form name='form3' method='post'>
           <input type="checkbox" name="option1" value="smoking" onClick="if (this.checked) this.form.submit();" <?php if(isset($_REQUEST['option1'])){ echo "checked='checked'";} ?>/> No Smoking<br>
           <input type="checkbox" name="option2" value="kids" onClick="if (this.checked) this.form.submit();" <?php if(isset($_REQUEST['option2'])){ echo "checked='checked'";} ?>/>Good for Kids<br>
           <input type="checkbox" name="option3" value="wheelchair" onClick="if (this.checked) this.form.submit();" <?php if(isset($_REQUEST['option3'])){ echo "checked='checked'";} ?>/>Wheelchair Accessible<br>
           <input type="checkbox" name="option4" value="alcohol" onClick="if (this.checked) this.form.submit();" <?php if(isset($_REQUEST['option4'])){ echo "checked='checked'";} ?>/>Serves Alcohol<br>
           <input type="checkbox" name="option5" value="delivery" onClick="if (this.checked) this.form.submit();" <?php if(isset($_REQUEST['option5'])){ echo "checked='checked'";} ?>/>Delivery Servicee<br>  
       </form>         

I’m trying to get both forms input to be preserved even when the other form changes.
Any help will be GLADLY appreciated. Thanks!

Answer 1

A better solution would be to use AJAX. But you can also add hidden input fields to both forms corresponding to the values in the opposite form:

<form name='form2' method='post'>
       <input type="radio" name="group1" value="all" onClick="if (this.checked) this.form.submit();" <?php if ($_REQUEST['group1'] == null || $_REQUEST['group1'] == "all"){ echo "checked='checked'";}?>/> All<br>
       <input type="radio" name="group1" value="Example" onClick="if (this.checked) this.form.submit();" <?php if ($_REQUEST['group1'] == "Example"){ echo "checked='checked'";}?>/> Example<br>
       <input type="radio" name="group1" value="clifton" onClick="if (this.checked) this.form.submit();" <?php if ($_REQUEST['group1'] == "clifton"){ echo "checked='checked'";}?>/> Clifton<br/>
       <input type="radio" name="group1" value="fruita" onClick="if (this.checked) this.form.submit();" <?php if ($_REQUEST['group1'] == "fruita"){ echo "checked='checked'";}?>/> Fruita<br/>
       <input type="radio" name="group1" value="loma" onClick="if (this.checked) this.form.submit();" <?php if ($_REQUEST['group1'] == "loma"){ echo "checked='checked'";}?>/> Loma<br/>
    <?php foreach( range( 1, 5) as $i): ?>
        <?php if(isset($_REQUEST['option' . $i])): ?>
            <input type="hidden" name="option<?php echo $i; ?>" value="1" />
        <?php endif; ?>
    <?php endforeach; ?>
</form>


<form name='form3' method='post'>
       <input type="checkbox" name="option1" value="smoking" onClick="if (this.checked) this.form.submit();" <?php if(isset($_REQUEST['option1'])){ echo "checked='checked'";} ?>/> No Smoking<br>
       <input type="checkbox" name="option2" value="kids" onClick="if (this.checked) this.form.submit();" <?php if(isset($_REQUEST['option2'])){ echo "checked='checked'";} ?>/>Good for Kids<br>
       <input type="checkbox" name="option3" value="wheelchair" onClick="if (this.checked) this.form.submit();" <?php if(isset($_REQUEST['option3'])){ echo "checked='checked'";} ?>/>Wheelchair Accessible<br>
       <input type="checkbox" name="option4" value="alcohol" onClick="if (this.checked) this.form.submit();" <?php if(isset($_REQUEST['option4'])){ echo "checked='checked'";} ?>/>Serves Alcohol<br>
       <input type="checkbox" name="option5" value="delivery" onClick="if (this.checked) this.form.submit();" <?php if(isset($_REQUEST['option5'])){ echo "checked='checked'";} ?>/>Delivery Servicee<br>  
       <input type="hidden" name="group1" value="<?php echo (isset($_REQUEST['group1']) ? $_REQUEST['group1'] : 'all'); ?>" />
</form>  

Edit: Here is a demo showing it working.