How can I use a reset button for php form?

StackOverflow https://stackoverflow.com/questions/711324

  •  22-08-2019
  •  | 
  •  

Question

I've got a form that I'm handling with PHP. Before the user submits it, the Reset button works. But when they submit and the page reloads (I've made the form fields sticky based on the $_POST values) the reset doesn't work. How can I fix that? EDIT: For example, a checkbox on the form:

 <input type="checkbox"  <?php if (isset($_POST['cb12'])){echo 'checked="checked"';} ?> name="cb12" tabindex="34" id=cb value="Education">

And the HTML:

<tr>
          <td colspan="5" valign="top" class="addit" ><div class="sectionbreak topsp" >
              <input type="hidden" name="failure" value="failure.html" >
              <p>
                <input type="submit" name="Submit" value="Submit" tabindex="49">
                Sends your application by email to The Boggs</p>
              <p>
                <input type="reset" name="Reset" value="Reset" tabindex="50">
                Clears all the fields</p>
            </div></td>
        </tr>

EDIT: In the end, I just hid the button if the form has been submitted (but isn't complete). Maybe no one will notice.

Was it helpful?

Solution

I've just been through this exact thing, see my previous question & the incredible helpful answers.

In the end I had to do a manual reset of the values in PHP.

EDIT: Not quite the same scenario for you as you seem to be populating the form values based on $_POST rather than $_SESSION as I did. In which case, see the answer I accepted via the link above.

OTHER TIPS

The reset button undoes changes to the form, made by the user, it doesn't erase default values. If you want to erase all default values, you could use JavaScript to do something like:

<script type="text/javascript">
   function resetForm(myFormId)
   {
       var myForm = document.getElementById(myFormId);

       for (var i = 0; i < myForm.elements.length; i++)
       {
           if ('submit' != myForm.elements[i].type && 'reset' != myForm.elements[i].type)
           {
               myForm.elements[i].checked = false;
               myForm.elements[i].value = '';
               myForm.elements[i].selectedIndex = 0;
           }
       }
   }
</script>

...

<form id="myFormId" ...>

<input name="reset" type="reset" onclick="resetForm('myFormId'); return false;" />

...

You could react to the reset event with an unset($_POST).

Answered this already in another post:

I'm just an intermediate in PHP, and a bit lazy to dive into a new language like JQuery, but isn't the following a simple and elegant solution?

<input name="Submit1" type="submit" value="Get free quote" />
<input name="submitreset" type="submit" value="Reset" />

Can't see a reason why not have two submit buttons, just with different purposes. Then simply:

if ($_POST['submitreset']=="Reset") {
$_source = "--Choose language from--";
$_target = "--Choose language to--"; }

You just redefine your values back to whatever the default is supposed to be.

The reset button undoes changes to the edited form values, made by the user, it doesn't erase default values.The reset button commonly used in edited pages or submit pages

<input type="reset" value="Reset" name="reset" />
Licensed under: CC-BY-SA with attribution
Not affiliated with StackOverflow
scroll top