reset button not working when php data submitted

**pkcidstudio** · 06-16-2006, 08:26 PM

now i have spent the better part of a hour searching for a answer on many forums. and so since i am typeing this you can imagine my amount of success to find a answer.
i have a fairly simple php form that i was trying out some functions with and it works great and well. unfortuntly the reset button only works untill you hit submit. i am wondering what the solution to this might be. i have read many places that people think it might be a javascript thing and that solution works if you want to reset your browser. but i am looking for a more direct root than that. i would like people to be able to hit the reset button and the 3 fields are cleared out. here is my code and i have imputed some explanaton to assist you in your answers.
kelly-

PHP Code:


<html>

<head>

<title>Function Arguments Example</title>

<meta http-equiv="refresh" content="10000">

</head>

<!--the java script if you want to reset the browesr-->

<body onload="document.forms['form'].reset(); return true;">

<h1>Showing a Volume</h1>

<br />

<div>

<!--my form-->

  <form name="form" action="bla.php" method="post">

    <!--this is $x-->

    <input type="text" maxlength="3" size="2" name="long" value="<?php echo $_POST["long"]; ?>" />

    <em>Enter Length</em><br>

    <!--this is $y-->

    <input type="text" maxlength="3" size="2" name="wide" value="<?php echo $_POST["wide"]; ?>" />

    <em>Enter Width</em><br>

    <!--this is $z-->

    <input type="text" maxlength="3" size="2" name="high" value="<?php echo $_POST["high"]; ?>" />

    <em>Enter Highth</em><br>

    <input type="submit" name="submit" value="Send ›" >

    <input type="reset" name="reset" value="Reset ›" >



</div>

<?php

//simple function to mees around with varibals

 if (isset($_POST["submit"]))

 {

    function CalcVol ($x, $y, $z)



    {



    $vol = $x * $y * $z;

    

    return $vol;

    

    }



    echo  "The volume of this object is " . CalcVol($_POST['long'], $_POST['wide'], $_POST['high']) . " volumetric units.";

    

}

?>



<?php

//simply telling people the forumula

    print "<br>the formula for volume is l*w*h= Volume in units";

?>

  </form>

</body>

</html>

in my searching i have noticed this is not a first time problem, but it does seam that it has never been trully answered.
kelly-

**djr33** · 06-17-2006, 10:24 AM

I'm not quite sure if I understand the question, but here is what I think is going on.

After submitting, does it reload the form with the values that you put in there in it?
As in.... you send the form, then the form reloads, with those non-blank values?

If so, then your problem is that it DOES reset, but back to the original state, which, in that case, is the values you entered on the last page.

Reset doesn't make it go blank; it puts everything back to what the value="" attribute has in it.

Looking at your code, you're displaying the values sent in the text fields. So, yes, it would reset to the original values... but not blank.

You just have to pick one of these options:
1. deal with it
2. set them to blank instead of the submitted values
3. try to setup some fairly complex javascript where you could have the JS set the initial values in the fields from the php, but have value="", so it is blank to begin (the state it will be reset back to).

**Twey** · 06-17-2006, 10:28 AM

Code:

function formReset(frm) {
  for(var i=0;i<frm.elements.length;i++)
    if(!(frm.elements[i].type && frm.elements[i].type == "submit"))
      frm.elements[i].value = "";
}

**djr33** · 06-17-2006, 10:30 AM

Yeah, looks about right.
You'd call that <form onReset="formReset(this)">?

**Twey** · 06-17-2006, 10:41 AM

Indeed.

**pkcidstudio** · 06-19-2006, 02:29 PM

PHP Code:


<html>
<head>
<title>Function Arguments Example</title>
<meta http-equiv="refresh" content="10000">
</head>
<!--the java script if you want to reset the browesr-->
<body onLoad="document.forms['form'].reset(); return true;">
<h1>Showing a Volume</h1>
<?php
//simply telling people the forumula
print "<br>the formula for volume is l*w*h= Volume in units";
?>
<br />
<p>
  <!--my form-->
<form name="form" action="bla.php" method="post" >
  <!--this is $x-->
  <input type="text" maxlength="3" size="2" name="long" value="<?php echo $_POST["long"]; ?>" />
  <em>Enter Length</em><br>
  <!--this is $y-->
  <input type="text" maxlength="3" size="2" name="wide" value="<?php echo $_POST["wide"]; ?>" />
  <em>Enter Width</em><br>
  <!--this is $z-->
  <input type="text" maxlength="3" size="2" name="high" value="<?php echo $_POST["high"]; ?>" />
  <em>Enter Highth</em><br>
  <input type="submit" name="submit" value="Send ›" >
  
  </form>
      </p>
  <?php
function CalcVol ($x, $y, $z)
{
    $vol = $x * $y * $z;
    return $vol;
}

//simple function to mess around with varibals
if (isset($_POST["submit"]))
{
    print $_POST['long'];
    print 'was the value of Length that was entered';
    print '<br>';
    print $_POST['wide'];
    print 'was the valuevalue of Width that was entered';
    print '<br>';
    print $_POST['high'];
    print 'was the valuevalue of Highth that was entered';
    print '<br>';
    echo  "The volume of this object is " . CalcVol($_POST['long'], $_POST['wide'], $_POST['high']) . " volumetric units.";
    print '<br>';
    print '<a href="'. $_SERVER['PHP_SELF'] .'">Reset ›</a>';
}

?>

</body>
</html>

completed simple function calling

**daveberk** · 04-12-2009, 01:51 AM

If you want to have a "Clear Form" button that will clear the values in the form, add this button inside your FORM tags:

<input type="reset" value="Clear Form" />

You will need to change the JavaScript "IF" statement (suggested above) from:

if(!(frm.elements[i].type && frm.elements[i].type == "submit"))

to:

if(!(frm.elements[i].type && frm.elements[i].type == "submit") && !(frm.elements[i].type && frm.elements[i].type == "reset"))

Otherwise the "Clear Form" value/text of your reset button will also be erased.

Also, the FORM tag code should be:

... onreset="formReset(this);return false;" ...

This will prevent the default reset behavior which would be to set the values back to the state they were when the page was re-loaded.

If you carried the values "forward" after submitting the form/data so that the values still showed in the form, you will need to use this JavaScript "reset" method to get the values "reset" to blank.

**daveberk** · 04-12-2009, 02:14 AM

Also, if you are using a hidden field to check for form submission like:

<input name="form_submitted" type="hidden" value="1" />

Be sure to reset the value to "1" in the JavaScript code:

function formReset(frm) {
...
frm.form_submitted.value = 1;
}

It can go just before the formReset function ends.

Otherwise your php code will not recognize the form submission the 2nd time it is submitted. This will allow the proper "fill - submit - clear - fill - submit - clear..." sequence you are probably trying to achieve.

**robinmitra1** · 08-09-2009, 04:10 PM

Thanks guys this solved my problem too...I have one question though as I aint got much experience working in javascript. In the statement:

Code:

if(!(frm.elements[i].type && frm.elements[i].type == "submit"))

what is the function of ANDing "frm.elements[i].type" and "frm.elements[i].type=="submit"" ? I guess it would still work if it was just:

Code:

if(!(frm.elements[i].type == "submit"))

?

Robin

**robinmitra1** · 08-09-2009, 04:58 PM

Daveberk: My form was getting back the values even after pressing the reset button. So I tried your code:

Code:

... onreset="formReset(this);return false;" ...

And now it works like a charm! Can you please explain how returning false makes it reset the values properly?

Thread: reset button not working when php data submitted

Thread Tools

Search Thread

reset button not working when php data submitted

If you want a "Clear" button...

Bookmarks

Bookmarks

Posting Permissions