Question

我有一个包含许多输入的大表单（表单可以有超过100个值），这似乎在使用jquery.serialize()发回服务器时会导致一些不稳定。

通常，在提交表单之前只更改了一个或两个值，所以我想我只尝试提交更改的值。只有我不知道该怎么做。

我想我想要选择表单上的所有输入并在其上调用jquery.change()，然后以某种方式使用eventData来确定更改的值。

对代码的任何帮助，或关于我如何处理此问题的其他想法将不胜感激。

我想我应该提到，这是MVC-4。

这是我到目前为止提出的脚本。

$(document).ready(function () {
    $("#EditForm").find("input")
        .on("change", function (event)
        {
            var name = this.name;
            var value = this.value;

            var form = {};
            form[name] = value;

            $.post("/Contracts/EditSingle", form, function (data)
            {
                $("#editContractResponse").html(data);
            });
    });
});

这有效，但它会在每个输入编辑上发布。我喜欢找出哪些输入是脏的，但不知道如何实现这一点的想法。

Answer 1

尝试以下内容。更改元素时我们所做的就是将该元素添加到数组中。提交表单时，我们只序列化该数组中的元素，然后发布它们。

$(document).ready(function() {
    var els = [];

    // This uses event delegation, as it's more optimal for attaching handlers to multiple elements
    $('#EditForm').on('change', 'input,select,textarea', function () {
        els.push(this);
    }).on('submit', function (e) {
        // Prevent the default action (form submission) occuring, so we can AJAX instead.
        e.preventDefault();



        jQuery.post('/Contacts/Edit', $(jQuery.unique(els)).serialize(), function (data) {
            $('#editContractResponse').html(data);
        });
    });
});

jQuery.unique()从数组中删除重复的DOM元素（同一元素一次又一次地更改）。如果您愿意，可以在change处理程序中检查此内容。 jQuery.unique()返回unique元素的数组，我们从中构建jQuery对象，并序列化结果。

选择表格值OnChange

1 个答案: