通过Ajax使用原型提交表单和更新结果的div [英] submit a form via Ajax using prototype and update a result div
问题描述
我不知道我该如何通过Ajax提交表单(使用原型框架),并显示在结果分区服务器响应。 在HTML看起来是这样的:
I'm wondering how can I submit a form via Ajax (using prototype framework) and display the server response in a "result" div. The html looks like this :
<form id="myForm" action="/getResults">
[...]
<input type="submit" value="submit" />
</form>
<div id="result"></div>
我试图附加一个JavaScript函数(使用的Ajax.Updater)来的onsubmit(上表)和onclick事件(输入),但形式是函数结束后提交的仍然是非Ajax (使整个页面被替换的结果)。
I tried to attach a javascript function (which uses Ajax.Updater) to "onsubmit" (on the form) and "onclick" (on the input) but the form is still "non-Ajax" submitted after the function ends (so the whole page is replaced by the results).
推荐答案
退房 Form.Request
和 事件
处理。
Check out Prototype API's pages on Form.Request
and Event
handling.
基本上,如果你有这样的:
Basically, if you have this:
<form id='myForm'>
.... fields ....
<input type='submit' value='Go'>
</form>
<div id='result'></div>
您的js会,或多或少:
Your js would be, more or less:
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使用原型提交表单和更新结果的div的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!