Question

我有一个PartialView，它使用从控制器传递来的模型类列表来渲染网格。

@model IEnumerable<DeliveryDashboard.Models.UpcomingDMR>

@Html.Partial("~/Views/Shared/_DMRGrid.cshtml", Model)

网格完美渲染。现在，我在网格顶部添加了一个下拉菜单。

在下拉列表的OnChange事件中，我需要点击控制器并获取Same Model Class的更新列表，该列表应刷新现有Grid。

<script type="text/javascript">

$(function () {
    //Refresh Grid on Date Range Change
    $('#DateRange').change(function () {

        $.ajax({
            url: '@Url.Content("~/DMR/UpcomingDMRByDateRange/")',
            dataType: 'json',
            type: 'POST',
            data: JSON.stringify({ DateRange: $('#DateRange option:selected').val() }),
            contentType: 'application/json',
            success: function (result) {
                // Refresh partialView Here
            }
        });
    });
});

我的控制器代码返回了用于绑定部分视图的模型类列表。

public List<UpcomingDMR> UpcomingDMRByDateRange(string DateRange)
{
    // get data from database and prepare List<UpcomingDMR> 
    return NewDataList;
}

现在如何从Ajax调用的Success block中刷新部分视图？

Answer 1

您可以在成功方法中这样做：

$(function () {
//Refresh Grid on Date Range Change
$('#DateRange').change(function () {

    $.ajax({
        url: '@Url.Content("~/DMR/UpcomingDMRByDateRange/")',
        dataType: 'json',
        type: 'POST',
        data: JSON.stringify({ DateRange: $('#DateRange option:selected').val() }),
        contentType: 'application/json',
        success: function (result) {
            $("#your_partial_view_id").load('@Url.Action("Foo","Bar")',result)
        }
    });
  });
});

在Ajax调用中使用新数据刷新现有网格（PartialView）

1 个答案: