仅更新页面上的部分视图

-1

我正在使用Google的图表api创建图表。我有一个客户下拉菜单，当客户被选中时，客户只需要更新我的图表的部分视图，而不是整个网站。因为如果网站被刷新，那么下拉菜单将重置。仅更新页面上的部分视图

这是我的页面的下拉部分代码：

<script type="text/javascript"> 
    function changeCustomer() { 
     $.ajax({ 
      type: 'GET', 
      url: "Reports/GetReportbyCustomer/", 
      data: { customerId: $("#Customers").val() }, 
      complete: function (result) { 
       debugger; 
      } 
     }); 
    } 
</script> 
<div id="filters"> 
    <table> 
     <tr> 
      <td>@Html.LabelFor(m => m.CustomerId) </td> 
      <td colspan="3">@Html.DropDownListFor(m => m.Customers, Model.Customers, new { @onchange = "changeCustomer()" })</td> 
     </tr> 
    </table> 
</div> 
<div id="content"> 
    @Html.Partial("TotalReport", Model.printDocuments) 
</div>

的TotaltReports局部视图只包含图表的构建和<div>图表中可以看到这里唯一重要的事情是我使用List<PrintDocumentsViewModel>作为模型。

当返回结果时，响应是整个页面的html代码。我将如何刷新我的TotaltReport局部视图？

来源

2016-02-04 Lahib

然后调用一个方法只返回只包含你想要更新的部分。 –

@StephenMuecke所以使用返回partialview（），然后将内容插入围绕此调用@ div.html.Partial（“TotalReport”，Model.printDocuments）的div？ – Lahib

我不知道你的'GetReportbyCustomer（）'返回了什么（你没有显示你的控制器代码），但假设它的一部分是你想要更新的，那么在ajax成功回调 - 'success：function（data）{$（ '＃内容'）的html（数据）。 }' –

当您通过selstion custome更改下拉列表时，将调用ajax并将数据发送到GetReportbyCustomer控制器。
更改ajax dataType到dataType: 'html'然后只有html部分或完整页面无法加载。
然后在GetReportbyCustomer控制器

public ActionResult GetReportbyCustomer() 
{ 
    . 
    . 
    return PartialView("PartialViewPageName", data to page); 
}

在PartialViewPageName
然后将HTML页将被返回到ajax sucess事件名称创建部分页面并加载数据，以查看像

success: function (result) 
{ 
    $('#content').html(data); 
}

在查看

<div id="content"> 
    Your data will be loaded here 
</div>

来源

2016-02-04 08:54:38 anand

仅更新页面上的部分视图

回答

相关问题