Jquery Ajax Post后局部视图刷新

Question

在我的c# MVC4应用程序中，我正在使用两个部分视图。 部分视图1位于具有id Partial_Analysis的div中，部分视图2位于具有id Display_Average的div中。 每个视图都包含一个datatables.net数据表。 当在部分视图1中选择一行时，将进行一个jquery ajax post，导致部分视图2刷新，并显示基于部分视图1中所做的行选择更新的数据表。

<script type="text/javascript" charset="utf-8">
    $(document).ready(function () {
        $('.rowselection').click(function (e) {
            var tdata = $('#form1').serialize();
            $.ajax({
                type: "POST",
                data: tdata,
                url: "Home/PartialAverage",
                success: function (result) { success(result); }
            });
        });

        function success(result) {
            $("#Display_Average").html(result);
        }
    });
</script>

当特定按钮被点击时，局部视图1会被刷新。

<script type="text/javascript" charset="utf-8">
    $(document).ready(function () {
        $('#ChangeName').click(function (e) {
            var tdata = $('#form1').serialize();
            var origname = $('#NameDiv').find('input[name="Name"]').first().val();
            var newname = $('#NameDiv').find('input[name="updatedName"]').first().val();
            $.ajax({
                type: "POST",
                data: {
                    mCollection: tdata,
                    Name: origname,
                    updatedName: newname
                },

                url: "Home/ChangeName",
                success: function (result) { success(result); }
            });
        });


        function success(result) {
            $("#Partial_Analysis").html(result);
        }
    });
</script>

在部分视图1刷新时，我希望第二个部分视图也能刷新。我尝试了这个方法，但导致了无限循环。

<script type="text/javascript" charset="utf-8">
    $(document).ready(function () {
        $('#Partial_Analysis').ajaxSuccess(function (e) {
            var tdata = $('#form1').serialize();
            $.ajax({
                type: "POST",
                data: {
                    mCollection: tdata,
                },

                url: "Home/PartialAverage",
                success: function (result) { success(result); }
            });
        });


        function success(result) {
            $("#Display_Average").html(result);
        }
    });
</script>

- HendPro12

Answer 1

ajaxSuccess 是一个全局处理程序，每当接收到ajax调用的响应时都会调用它。在其中执行另一个ajax调用将绝对导致无限循环。

在第一个部分视图的success处理程序中更新第二个表格可能是最好的选择：

function success(result) {
    $("#Partial_Analysis").html(result);

    reloadDisplayAverage();
}

function reloadDisplayAverage() {   
    var tdata = $('#form1').serialize();
    $.ajax({
        type: "POST",
        data: {
            mCollection: tdata,
        },
        url: "Home/PartialAverage",
        success: function (result) { success(result); }
    });

    function success(result) {
        $("#Display_Average").html(result);
    }
}

- Andrei

---

你可以使用 $.post。 - Kiquenet

Answer 2

如果响应是 Ajax 响应...那么

   $.ajax({
                url: 'Home/PartialAverage',
                data: {mCollection: tdata,},
                type: 'POST',
                success: function (result) {

                    $("#Display_Average").html(data);
                }
            });

这应该适用于你...对我来说有效...

- chaitanyasingu