代码之家  ›  专栏  ›  技术社区  ›  Andiih

如何使用jquery“提交”表单的一部分

  •  4
  • Andiih  · 技术社区  · 15 年前

    我有一张像电子表格一样的表格。当用户离开一行时,我想使用jquery ajax将该行中的字段提交给服务器。页面是一个大的表单,所以这不是一个javascript点击提交按钮的场景-表单很大,我只想发送一小部分内容,因为速度太快。

    我已经编写了代码来标识行并遍历行中的字段。我的问题是如何构建DAT对象,以便提交一些可以理解的东西,我可以在服务器端进行分解和存储。

    现在我的代码看起来像这样

    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);
        }
    });
    

    DAT的组装根本不起作用。那么,我应该如何构建这个dat对象,以便它尽可能“看起来”像一个表单提交。

    3 回复  |  直到 15 年前
        1
  •  7
  •   Cristian Sanchez    15 年前

    可以添加包含要发送到jquery集合的数据的元素,然后调用 serialize 方法。它将返回一个可以发送到服务器的参数字符串。

    var params = $("#" + finalrow).find("input").serialize();
    
    $.ajax({
        url: 'UpdateRowAjax',
        type: 'POST',
        data: params ,
        success: function (data) {
            renderAjaxResponse(data);
        }
    });
    
        2
  •  3
  •   Andy E    15 年前

    你可以使用 $.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() 映射到这个函数,因此以这种方式调用它应该稍微更有效率。

        3
  •  2
  •   karim79    15 年前

    $.ajax “data”参数需要键/值对(或字符串)的映射,而不是对象数组。试试这个:

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