我在一页中有10个表单&数据是通过ajax提交的,现在我不想为每个表单创建ajax脚本
var form_id = $(this).closest("form").attr('id');
$(document).on("submit", "#"+form_id, function(e){
e.preventDefault();
var postData = $("#"form_id).serialize()
var send = true;
var ptel = 1;
$("#"+form_id).find("input").each(function () {
if ($(this).val() === '') { send = false; ptel = 0; }
});
if(ptel == 0) { bootbox.alert('Please Fill All fields'); }
if(send){
$('form_id').trigger("reset");
$.ajax({
type: "POST",
url: "/ajax/X-Profile",
data: postData,
cache: false,
success: function(msg)
{
bootbox.alert('Your Profile has been updated.');
}
});
}
return false;
});
var form_id导致未定义,因为当页面加载时,没有为其定义属性
以上代码只是为了让您理解,所以我的问题是如何通过单个ajax函数
您可以创建一个函数,如SendForm(),并将其附加到表单的onsubmit属性
<form id="yourid" onsubmit="SendForm(this);return false;">
在SendForm()函数中放置脚本
例如:
function SendForm(form) {
var postData = form.serialize();
// .......etc
}
要知道哪个表单是用PHP提交的,您可以在表单中放置一个隐藏的输入,或者在SendForm上设置第二个通过发送的参数,例如SendForm(node,formtype)
如果表单没有提交或页面重新加载,请删除onsubmit属性并将其添加到JS中,而不是
$(document).on("submit","form", function(e){
e.preventDefault();
SendForm($(this));
return false;
});
具有如下所示的javascript函数
<script type="text/javascript">
function submitForm(formID) {
data = $('#'+formID).serialize();
//your ajax code
}
</script>
现在使用输入按钮和下面的onclick,并将表单Id作为参数
<input type="button" value="Submit" onclick="submitForm({formID})">
这将在不刷新页面的情况下工作。成功后,您可以触发reset()函数来形成特定的表单值。