Question : Clearing a submit form once submitted

I have a submit form set up which works fine except.....

Once the form is submitted the details that have been inputted remain there.

Is there anyway that, once submitted, the form can reset and become blank?

I have attached the code for the form page, if any other code is needed ie contact.php etc let me know and i'll attach that to.
1:
2:
3:
4:
5:
6:
7:
8:
9:
10:
11:
12:
13:
14:
15:
16:
17:
18:
19:
20:
21:
22:
23:
24:
25:
26:
27:
28:
29:
30:
31:
32:
33:
34:
35:
36:
37:
38:
39:
40:
41:
42:
43:
44:
45:
46:
47:
48:
49:
50:
51:
52:
53:
54:
55:
56:
57:
58:
59:
60:
61:
62:
63:
64:
65:
66:
67:
68:
69:
70:
71:
72:
73:
74:
75:
76:
77:
78:
79:
80:
81:
82:
83:
84:
85:
86:
87:
88:
89:
90:
91:
92:
93:
94:
95:
96:
97:
98:
99:
100:
101:
102:
103:
104:
105:
106:
107:
108:
109:
110:
111:
112:
113:
114:
115:
116:
117:
118:
119:
120:
121:
122:
123:
124:
125:
126:
127:
128:
129:
130:
131:
132:
133:
134:
135:
136:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>Oracle Database Backup and Recovery</title>
<script src="Scripts/swfobject_modified.js" type="text/javascript"></script>
<script src="SpryAssets/SpryValidationTextField.js" type="text/javascript"></script>
<link href="dba.css" rel="stylesheet" type="text/css" />
<link rel="stylesheet" type="text/css" href="style.css" />
<script type="text/javascript">
<!--
function MM_preloadImages() { //v3.0
  var d=document; if(d.images){ if(!d.MM_p) d.MM_p=new Array();
    var i,j=d.MM_p.length,a=MM_preloadImages.arguments; for(i=0; i<a.length; i++)
    if (a[i].indexOf("#")!=0){ d.MM_p[j]=new Image; d.MM_p[j++].src=a[i];}}
}
//-->
</script>

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4/jquery.min.js"></script>

<script type="text/javascript">  
        
$(document).ready(function() {
	
    $("#ajax-contact-form").submit(function() {
        $('#load').append('<center><img src="ajax-loader.gif" alt="Currently Loading" id="loading" /></center>');

        var fem = $(this).serialize(),
			note = $('#note');
	
        $.ajax({
            type: "POST",
            url: "contact.php",
            data: fem,
            success: function(msg) {
				if ( note.height() ) {			
					note.slideUp(1000, function() { $(this).hide(); });
				} 
				else note.hide();

				$('#loading').fadeOut(300, function() {
					$(this).remove();

					// Message Sent? Show the 'Thank You' message and hide the form
					result = (msg === 'OK') ? '<div class="success">Your message has been sent. Thank you!</div>' : msg;

					var i = setInterval(function() {
						if ( !note.is(':visible') ) {
							note.html(result).slideDown(1000);
							clearInterval(i);
						}
					}, 40);    
				}); // end loading image fadeOut
            }
        });

        return false;
    });
});


</script>
<link href="SpryAssets/SpryValidationTextField.css" rel="stylesheet" type="text/css" />
</head>

<body onload="MM_preloadImages('images/but-about-ovr.jpg')">
<table width="500" border="0" align="center" cellpadding="0" cellspacing="0">
  <tr>
    <td align="center">&nbsp;</td>
  </tr>
  <tr>
    <td align="center" bgcolor="#000000"><table width="665" border="0" cellpadding="0" cellspacing="0" class="contact">
      <tr>
        <td width="465" height="319" align="center" valign="top"><table width="600" border="0" align="left" cellpadding="0" cellspacing="0" class="mainholder">
          <tr>
            <td align="left"><table width="590" border="0" cellpadding="0" cellspacing="0">
              <tr>
                <td align="left"><p class="copybold">If you would like to order a product or have any queires please contact us <br />
                  using the details below or fill in the submit the form.<br />
                  <br />
                  Once you submit your details we will call you to discuss your requirements.</p></td>
                </tr>
              <tr>
                <td align="left" valign="top"><p><span class="questionsgreen"><a href="mailto:[email protected]"><img src="images/email.png" alt="email" width="19" height="10" border="0" /></a></span><br />
                  <br />
                  </p></td>
                </tr>
              </table>      </td>
            </tr>
          <tr>
            <td align="left"><div id="contactform">
              <fieldset>
                
                <!--begin:notice message block-->
                <div id="note"></div>
                <!--begin:notice message block-->
                
                <form action="contact.php" method="post" id="ajax-contact-form" >
                  
                  <label>Name</label><input class="required inpt" type="text" name="name" value="" /><br />
                  <label>E-Mail</label><input class="required inpt" type="text" name="email" value="" /><br />
                  <label>Phone Number</label><input class="required inpt" type="text" name="phone" value="" /><br />
                  <label>Service</label>
                  <select name="subject" id="subject" class="select">
                    <option value="">Which Service are you interested in?</option>
                    <option value="Emergency Oracle DBA Restore / Recovery assistance">Emergency Oracle DBA Restore / Recovery assistance</option>
                    <option value="Oracle Backup and Recovery DBA Consulting">Oracle Backup and Recovery DBA Consulting</option>
                    <option value="Oracle Backup and Recovery Products">Oracle Backup and Recovery Products</option>
                    <option value="Oracle Backup and Recovery Training">Oracle Backup and Recovery Training</option>
                    <option value="I would like to order RECON">I would like to order RECON</option>
                    <option value="Could you please call me back to discuss">Could you please call me back to discuss</option>
                    </select>
                  <!--  <input class="required inpt" type="text" name="subject" value="" /> --><br />
                  <label>Comments</label><textarea class="textbox" name="message" rows="6" cols="30"></textarea><br />
                  <label>Security Question 5-2+1 </label><input class="required inpt" type="text" name="answer" value="" /><br />
                  <label id="load"></label><input name="submit" type="image" class="btn" src="images/submit.gif" value="Send" />
                  
                  </form>
                </fieldset></td>
            </tr>
          </table></td>
      </tr>
    </table></td>
  </tr>
  <tr>
    <td align="right" valign="top" bgcolor="#000000"><table width="314" border="0" cellpadding="5" cellspacing="0" class="copyright">
      <tr>
        <td align="right" class="copyright">© DBA Universe 2010</td>
      </tr>
    </table></td>
  </tr>
</table>

</body>
</html>

Answer : Clearing a submit form once submitted

Be careful using javascript to clear form fields.  If the user's entered data triggers a problem server-side, they will have to go back and correct their entry.  This will be very annoying if their entries have all been wiped!  I'd use PHP to clear the values once the form has been processed.  One easy option is the process the form data on a seperate page, then they can just press BACK if a problem occurs.  You can then redirect them to the form page after processing, which will automatically show a fresh form
Random Solutions  
 
programming4us programming4us