c# - Jquery Ajax 发布后局部 View 刷新

Question

在我的 C# MVC4 应用程序中，我使用两个局部 View 。局部 View 1 位于 ID 为 Partial_Analysis 的 div 中，局部 View 2 位于 ID 为 Display_Average 的 div 中。每个 View 都包含一个 datatables.net 数据表。当在部分 View 1 的表中选择一行时，会生成一个 jquery ajax post，导致部分 View 2 使用更新的数据表刷新，显示基于在部分 View 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>

单击特定按钮时，将刷新部分 View 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>

在局部 View 1 刷新后，我希望第二个局部 View 也刷新。我试过这会导致无限循环。

<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>

Answer 1

ajaxSuccess 是一个全局处理程序，只要收到 ajax 调用的响应，它就会被调用。在其中执行另一个 ajax 调用肯定会导致无限循环。

这里最好的选择可能是更新第一个部分 View 的 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);
    }
}