[英]submit a form via Ajax using prototype and update a result div
我想知道如何通过Ajax(使用原型框架)提交表单并在“结果”div中显示服务器响应。 html看起来像这样:
<form id="myForm" action="/getResults">
[...]
<input type="submit" value="submit" />
</form>
<div id="result"></div>
我试图将一个javascript函数(使用Ajax.Updater)附加到“onsubmit”(在表单上)和“onclick”(在输入上)但是在函数结束后表单仍然是“非Ajax”(所以整个页面被结果替换)。
在Form.Request
和Event
处理上查看Prototype API的页面。
基本上,如果你有这个:
<form id='myForm'>
.... fields ....
<input type='submit' value='Go'>
</form>
<div id='result'></div>
你的js会或多或少:
Event.observe('myForm', 'submit', function(event) {
$('myForm').request({
onFailure: function() { .... },
onSuccess: function(t) {
$('result').update(t.responseText);
}
});
Event.stop(event); // stop the form from submitting
});
您需要从ajax函数返回false值,该函数会阻止标准表单提交。
<form id="myForm" onsubmit="return myfunc()" action="/getResults">
function myfunc(){
... do prototype ajax stuff...
return false;
}
在表单上使用onsubmit还会捕获使用回车键提交的用户。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.