asp.net - 使用 AJAX 发布 Asp.net 表单

Question

我对 JQuery 有点陌生。假设我们有这个 jquery 函数:

var f = $("#myForm");
var url = f.attr("action");
var formData = f.serialize();
$.post(url, formData, function(data) {
    $("#postResult").html(data);
});

这个表格:

<form id="myForm" action="/Monitor/Test/FormPost" method="post">
    <div>First Name: <input name="FirstName" type="text" value="Bob" /></div>
    <div>Last Name: <input name="LastName" type="text" value="Cravens" /></div>
    <div>Age: <input name="Age" type="text" value="43" /></div>
    <input type="submit" value="Save Contact" />
    <div id="postResult">?</div>
</form>

如何将保存按钮与jquery函数绑定(bind)？谢谢

Answer 1

一种简单的方法是绑定(bind)到按钮的单击事件。像这样的事情:

$('#myForm input[type="submit"]').click(function () {
    var f = $("#myForm");
    var url = f.attr("action");
    var formData = f.serialize();
    $.post(url, formData, function(data) {
        $("#postResult").html(data);
    });
});

这专门查找作为 id“myForm”表单子(monad)级的提交输入(如果有其他按钮等)，并使用相关函数响应其点击事件。

为了安全起见，由于您实际上是在短路表单并通过 AJAX 进行发布，因此您还应该将 submit 更改为普通的 button:

<input type="button" value="Save Contact" />

或者也许:

<button value="Save Contact" />

这会将您的 jQuery 选择器更改为:

$('#myForm input[type="button"]')

或者:

$('#myForm button')