Forum Moderators: open
Everything is ok with my website regarding the comments which user submits at bottom of the each page, but there is little problem with form refresh or reset.
All of information submitted through ajax and php , after submitting the user's comments, form does not refresh or reset I mean last user comments remain same in the form feilds, I want that when the user submit his comments, comments form automatically reset or empty.
My html form is below:
<form action="javascript:get(document.getElementById('myform'));" name="myform" id="myform">
<input type="hidden" id="mobile" value="<?php echo $mobile; ?>">
Name:<input type='text' id='name' size='30'>
Email:<input type='text' id='email' size='30'>
City:<input type='text' id='city' size='30'>
Comment:<textarea id='message' cols='30' rows='6'></textarea>
<input type='submit' name='submit' value='Add Comments'>
</form>
ajax code is below:
var http_request = false;
function makePOSTRequest(url, parameters) {
http_request = false;
if (window.XMLHttpRequest) { // Mozilla, Safari,...
http_request = new XMLHttpRequest();
if (http_request.overrideMimeType) {
// set type accordingly to anticipated content type
//http_request.overrideMimeType('text/xml');
http_request.overrideMimeType('text/html');
}
} else if (window.ActiveXObject) { // IE
try {
http_request = new ActiveXObject("Msxml2.XMLHTTP");
} catch (e) {
try {
http_request = new ActiveXObject("Microsoft.XMLHTTP");
} catch (e) {}
}
}
if (!http_request) {
alert('Cannot create XMLHTTP instance');
return false;
}
http_request.onreadystatechange = alertContents;
http_request.open('POST', url, true);
http_request.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
http_request.setRequestHeader("Content-length", parameters.length);
http_request.setRequestHeader("Connection", "close");
http_request.send(parameters);
}
function alertContents() {
if (http_request.readyState == 4) {
if (http_request.status == 200) {
//alert(http_request.responseText);
result = http_request.responseText;
document.getElementById('myspan').innerHTML = result;
} else {
alert(http_request.status);
}
}
}
function get(obj) {
var poststr = "mobile=" + encodeURI( document.getElementById("mobile").value ) +
"&name=" + encodeURI( document.getElementById("name").value ) +
"&email=" + encodeURI( document.getElementById("email").value )+
"&city=" + encodeURI( document.getElementById("city").value )+
"&message=" + encodeURI( document.getElementById("message").value );
makePOSTRequest('post.php', poststr);
}
PHP code is as follow:
<?php include_once("../includes/connection.php"); ?>
<?php
$mobile = strip_tags($_POST['mobile']);
$name = strip_tags($_POST['name']);
$email = strip_tags($_POST['email']);
$city = strip_tags($_POST['city']);
$message = strip_tags($_POST['message']);
if($name&&$email&&$city&&$message){
$insertSite_sql = "INSERT INTO comments (id,mobid,date,name,email,city,message,approve) VALUES('','$mobile',now(),'$name','$email','$city','$message','approve')";
$insertSite= mysql_query($insertSite_sql) or die(mysql_error());
echo "<center><font color='red'><b>Your Comment has been Successfully added to our database, <br> Your Comment will be display on our
website after administrator manually check within 24 hours.<br> Once, your Comment approved by Administrator a confirmation email will be sent to you immediatelly.</b></font></center><br>";
echo "
<table width='98%' cellspacing='0' cellpadding='0' class='comment' align='center'>
<tr>
<td height='20' width='80'> Posted by:</td>
<td height='20'>$name</td>
</tr>
<tr>
<td height='20'> Email:</td>
<td height='20'>$email</td>
</tr>
<tr>
<td height='20'> City:</td>
<td height='20'>$city</td>
</tr>
<tr>
<td height='20'> Comment:</td>
<td height='20'>$message</td>
</tr>
</table>
<br>
";
} else {
echo "<center><font color='red'><b>Error ! Please Fill All Fields.</b></font></center><br>";
}
?>
Please senior member of this forum help me.
waiting for your early response, and thanks in advance..
Best Regards....
result = http_request.responseText;
document.getElementById('myspan').innerHTML = result;
document.getElementById('mobile').value ='';
document.getElementById('email').value ='';
document.getElementById('name').value ='';
document.getElementById('city').value ='';
document.getElementById('message').value ='';
