[英]Page refresh instead of Ajax Load without
On form submit i want to load a div with an updated list of a mysql table. 在表单提交我想加载一个div与更新的mysql表列表。 I'am sending the form variables across to a php and posting them into a mysql table.
我将表单变量发送到php并将它们发布到mysql表中。 the same page displays the full table data.
同一页面显示完整的表格数据。 I want to load the data into the same div tag as the form.
我想将数据加载到与表单相同的div标签中。 So it appears that the information is being loaded above the form.
因此,似乎信息正在表单上方加载。
My Javascript 我的Javascript
$("#formSubmit").submit(function(){
var name = $("input#name").val();
var comment = $("input#comment").val();
var filmnumber = $("input#hidden").val();
var dataString = 'name='+ name + '&comment=' + comment + '&filmnumber=' + filmnumber;
$.ajax({
type: "POST",
url: "comment.php",
data: dataString,
success: function() {
$('#2').load('comment.php');
}
});
My form - 我的表格 -
<div id="2">
<p>Add a Comment</p>
<form id="formSubmit" method="POST">
<div>
<input type="hidden" name="hidden" id="hidden" value="2">
<label for="name">Your Name</label>
<input type="text" name="name" id="name" />
<label for="body">Comment Body</label>
<textarea name="comment" id="comment" cols="20" rows="5"></textarea>
<input type="submit" id="comment" class="button" value="Submit" />
</form>
</div>
All it is doing is refreshing the page and not loading the information in to div 2 :S 它所做的只是刷新页面而不是将信息加载到div 2:S中
thanks for your help 谢谢你的帮助
You need to prevent the form from redirecting the page using the preventDefault
method on the event object: 您需要阻止表单使用事件对象上的
preventDefault
方法重定向页面:
$("#formSubmit").submit(function(e){ // add the event object as an argument to your function
e.preventDefault(); // right here
var name = $("input#name").val();
var comment = $("input#comment").val();
var filmnumber = $("input#hidden").val();
var dataString = 'name='+ name + '&comment=' + comment + '&filmnumber=' + filmnumber;
$.ajax({
type: "POST",
url: "comment.php",
data: dataString,
success: function() {
$('#2').load('comment.php');
}
});
});
add a return false to the end to stop the form from submitting. 在结尾添加一个返回false以阻止表单提交。 or if you want to be more elegant use the preventDefault();
或者如果你想更优雅,请使用preventDefault(); method.
方法。 personally for something as simple as this though i just stick with return false;
亲自为这样简单的东西,虽然我坚持回归虚假;
$("#formSubmit").submit(function(e){ // add the event object as an argument to your function
var name = $("input#name").val();
var comment = $("input#comment").val();
var filmnumber = $("input#hidden").val();
var dataString = 'name='+ name + '&comment=' + comment + '&filmnumber=' + filmnumber;
$.ajax({
type: "POST",
url: "comment.php",
data: dataString,
success: function() {
$('#2').load('comment.php');
}
});
return false;//right here
}); });
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.