如何使用jQuery「提交」表單的一部分

我得到了一個表單，就像電子表格一樣。當用戶離開一行時，我想使用jQuery Ajax將該行中的字段提交給服務器。該頁面是一個大表單，所以這不是一個單擊提交按鈕場景的JavaScript - 表單很大，我只想發送一小部分內容以提高速度。如何使用jQuery「提交」表單的一部分

我已經寫了代碼來標識行並遍歷行中的字段。我的問題是如何構建數據對象，以便提交我可以在服務器端反彙編和存儲的可理解的內容。

目前我的代碼看起來像這樣

var dat=[]; 
$("#" + finalrow).find("input").each(function() { 
    var o = $(this).attr("name"); 
    var v = $(this).val(); 
    dat.push({ o: v }); 
}); 
$.ajax({ 
    url: 'UpdateRowAjax', 
    dataType: 'json', 
    type: 'POST', 
    data: dat , 
    success: function (data) { 
     renderAjaxResponse(data); 
    } 
});

的逸的裝配並不在所有的工作。那麼我應該如何構建這個數據對象，以便它儘可能像表單提交那樣「看起來」。

來源

2010-09-08 Andiih

您可以添加包含要發送到jQuery集合的數據的元素，然後在該對象上調用serialize方法。它會返回一個可以發送給服務器的參數字符串。

var params = $("#" + finalrow).find("input").serialize(); 

$.ajax({ 
    url: 'UpdateRowAjax', 
    type: 'POST', 
    data: params , 
    success: function (data) { 
     renderAjaxResponse(data); 
    } 
});

來源

2010-09-08 17:11:31

感謝您的快速響應。 jQuery網站似乎已經關閉，我之前沒有使用過收集（我認爲它是您正在討論的插件），但是，karim79的方法就是我所需要的。 – Andiih 2010-09-08 17:20:34

@Andiih：所有jQuery對象實際上都是集合。一個jQuery對象是零個或多個元素的集合。 '$（「＃」+ finalrow）.find（「input」）'是匹配選擇器和附加的'find'調用的元素的集合。當你調用序列化時，它會創建一個包含該集合中所有合格元素的參數字符串。它包含在jQuery核心中，沒有一個需要插件。 – 2010-09-08 17:27:39

感謝您的澄清，確實可以完美地工作！ – Andiih 2010-09-08 17:51:53

$.ajax「數據」參數期望地圖鍵/值對（或字符串）的，而不是對象的數組。試試這個：

var dat = {}; 
$("#" + finalrow).find("input").each(function() { 
    dat[$(this).attr('name')] = $(this).val(); 
});

來源

2010-09-08 17:13:07 karim79

起初，我認爲這是工作，但事實上，雖然dat看起來似乎合理一旦組裝，服務器formcollection是空的。 – Andiih 2010-09-08 17:50:40

您可以使用$.param()序列化元素列表。例如，在你的代碼：

var dat= $.param($("input", "#finalrow")); 
$.ajax({ 
    url: 'UpdateRowAjax', 
    dataType: 'json', 
    type: 'POST', 
    data: dat , 
    success: function (data) { 
     renderAjaxResponse(data); 
    } 
});

的$ .PARAM（例）：http://jsfiddle.net/2nsTr/

serialize()映射到這個功能，所以叫它這樣應該稍微更有效。

來源

2010-09-08 17:14:47

謝謝。非常酷和一個有用的現場示例。我將使用karim79的解決方案作爲它的概念上更簡單，但我真的很看重你的輸入。 – Andiih 2010-09-08 17:23:24

如何使用jQuery「提交」表單的一部分

回答

相關問題