如何創建動態AJAX提交表格

我在頁面中有10個表格&那裏的數據通過ajax提交，現在我不想爲每個表單創建一個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不確定的，因爲當頁面加載結果沒有屬性被定義爲它

上面的代碼只是爲了讓你明白，所以我的問題是如何才能讓10所形成提交通過單個AJAX功能

來源

2016-05-12 Aniket Singh

難道你不能在按鈕上單擊窗體嗎？獲取該按鈕的最接近的表單ID並觸發AJAX調用 –

$（「＃」form_id）.serialize（） - 缺少一個'+' - '$（「＃」+ form_id）.serialize（）'。還有'$（'form_id'）。trigger（「reset」）;' - 可能是錯誤的？ – Pete

@Pete我已經在帖子中告訴過，這段代碼只是作爲參考，它只是在以上代碼中輸入錯誤 –

可以創建一個功能，諸如SendForm（），並將它附加到形式onsubmit屬性

<form id="yourid" onsubmit="SendForm(this);return false;">

的SendForm（）函數中把你的腳本

例如：

function SendForm(form) {  
    var postData = form.serialize(); 
    // .......etc 
}

要知道哪些形式是PHP提交，你可以將一個隱藏的輸入表單內或有SendForm第二個參數，獲得通過發送，如SendForm（節點，formtype）

如果窗體未提交或頁面重新加載，刪除onsubmit屬性，並添加到您的JS，而不是

$(document).on("submit","form", function(e){ 
    e.preventDefault(); 
    SendForm($(this)); 
    return false; 
});

來源

2016-05-12 09:41:17

請問能澄清什麼是節點？ –

這只是你通過函數發送的表單。我會更改名稱以清楚說明。 –

提交表單後刷新頁面 –

有像下面

<script type="text/javascript"> 
    function submitForm(formID) { 
     data = $('#'+formID).serialize(); 
     //your ajax code 
    } 
</script>

現在使用輸入按鈕上用onclick像下面，並通過形式ID作爲參數

<input type="button" value="Submit" onclick="submitForm({formID})">

這將無需刷新頁面運行JavaScript函數。成功後，您可以觸發reset（）函數來形成特定的表單值。

來源

2016-05-12 10:47:02 JiteshNK

如何創建動態AJAX提交表格

回答

相關問題