Asp.net mvc 如何在AJAX帖子上刷新razor视图

大家好

我可以使用ajax.post发布到控制器，但如果成功，如何使用新数据刷新视图

我是否需要usn@Html.BeginForm来执行此操作

这是我的看法

<div>
    <p>Order lines allocates to <b>@Model.Name (@Model.Code) </b>
</div>
@if (Model.OrderLineAllocations.Any())
{

    @grid.GetHtml(
             columns: grid.Columns(
                 grid.Column(header: "Dispatched", style: "row-selector", format: @<text><input name="chkSelected" class="myCheckbox" onclick="expandableEvent(this)" type="checkbox" value="@item.IdAllocation" /></text>),
                 grid.Column(header: "Order Ref", format: item => item.OrderLineItem.OrderLine.Order.OrderRef)
                 ),
             tableStyle: "expandable-table",
             rowStyle: "expandable-master-row",
             htmlAttributes: new { id = "gridLineAllocations" })
    <br />
    <input type="hidden" id="hidUnselectedValues" name="hidUnselectedValues" />

    <input type="submit" name="action" value="Dispacth" id="btnDispacth" />
    <input type="submit" name="action" value="Revert" id="btnRevert" />

}
else
{
    @Html.Raw("No records found....");
}

这是我的控制器动作

[HttpPost]
        public ActionResult GetData(long[] allocationId,long batchId)
        {
           var model = context.GetData(batchId)
            model.Name = "asdaksdjaksdj";
            return View("Finalize", model);
        }

我有一些想法，我必须在成功回电时这样做。但我不知道如何将更新后的模型绑定到客户端的视图

谢谢

mvc中没有简单的“重新绑定”方法，最后还是html、css和js。
我认为有两种选择可以实现预期的行为

备选案文1。使用POST的结果覆盖呈现的内容 在这种情况下，您的视图将类似于：

<div id="content">
  <div>
    <p>Order lines allocates to <b>@Model.Name (@Model.Code) </b>
  </div>
  ...
  else
  {
    @Html.Raw("No records found....");
  }
</div>

备选案文2。每次加载时从javascript填充呈现的html 这需要将Razor逻辑移动到javascript。 您的视图将如下所示：

<div>
    <p>Order lines allocates to <b id="NameAndCode"></b>
</div>

这只是一个小片段，只是为了展示这个想法

---

这取决于选择哪个选项。

我尝试了第一个选项，用完整视图html替换div html。我认为这是第一种方法，我应该使用部分视图，并用部分视图html替换div html。使用部分视图，您的第一个建议运行良好。谢谢

$.ajax({
    type: 'POST',
    url: '/Batch/GetData',
    dataType: "html",
    success: function(data, textStatus, jqXHR){
        $('#content').html(data);
    }
});

<div>
    <p>Order lines allocates to <b id="NameAndCode"></b>
</div>

$(function(){
  var model = {
    NameAndCode: "@Model.Name (@Model.Code)"
  }

  fillView(model);

})

var fillView = function(data){
  $('#NameAndCode').html(data.NameAndCode)
}

$.ajax({
    type: 'POST',
    url: '/Batch/GetData',
    dataType: "json",
    success: function(data, textStatus, jqXHR){
        fillView(data);
    }
});