我似乎不知道如何使用 Ajax 从 jquery ui 按钮功能提交表单。
这是我通过传统方式提交表单的脚本
$('#contact-form').dialog({
modal: true,
autoOpen: false,
buttons: {
Cancel: function () {
$(this).dialog('close');
},
Ok: function () {
$('form#contactUs').submit();
$(this).dialog('destroy');
}
}
});
$('#contact-us').click(function () {
$('#contact-form').dialog('open');
return false;
});
});
这是我的表格
<div id="contact-form" class="hidden" title="Online Request Form">
<form action="/Main/Contact/contactUs" method="post">
<div>
<label for="Name">Name</label><br />
<input name="Name" /><br />
<label for="PhoneNumber">Phone Number</label><br />
<input name="PhoneNumber" /><br />
<label for="EmailAddress">Email Address</label><br />
<input name="EmailAddress" /><br />
<label for="Question">Question or Comment</label><br />
<textarea name="Question"></textarea><br />
<label for="Security">What color is an orange?</label><br />
<input name="Security" />
<noscript>
<input type="submit" name="submit" value="Ok" />
</noscript>
</div>
</form>
</div>
如何更改此设置以通过 Ajax 提交链接，以便显示成功消息？
最佳答案
这可能就足够了:
$("#contact-form form").submit(function(e) {
e.preventDefault();
$.post( $(this).attr('action'), $(this).serialize(),
function(resp) {
if(resp == "success") {
alert('Submission was successful');
} else {
// something else
}
}
});
});
简要说明:
- 将 onsubmit 事件处理程序绑定(bind)到联系表单。阻止“正常”提交。
- 序列化表单，并将结果发送到表单的操作。
- 评估响应，并以某种方式显示一条消息。
进一步阅读:
关于jquery - 将 jquery.submit 转换为 ajax 提交，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/4476215/