该项目使用 MVC3 和 Razor。我们有一个繁忙的页面,数据通过 WCF 服务来自大型机数据库,因此我们希望限制一次加载的内容。基本数据在页面加载时加载,但随后会有一些 div 用于附加数据。我们使用 @Html.Partial(pagename) 在 div 中呈现部分页面。ViewModel 的这一部分最初是空的,因此不会显示任何数据。
我们希望用户单击以转到 Controller 方法,调用另一个服务,并用更多数据填充 ViewModel 的一部分。然后用数据刷新页面的这一部分。
如何在用户点击时刷新 HTML.Partial(pagename)?我尝试了对适当 URL 的 Ajax 调用,但它没有刷新显示。
编辑:这是我的代码,尝试使用下面 Darin Dimitrov 的建议。
我的视图模型:
namespace Project.ViewModel
{
public class AllData
{
public string Id { get; set; }
public BasicData Basics { get; set; }
public ContactInfo ContactPoints { get; set; } //mainframe data
}
}
主页:
@model Project.ViewModel.AllData
<script type="text/javascript">
$(function () {
$('#loadFromMainFrame').click(function (e) {
var url = $(this).data(url);
$('#MainframeContents').load(url);
});
});
</script>
<div id="basics">
<div>
@Html.DisplayFor(model => model.Basics.FirstName)
</div>
<div>
@Html.DisplayFor(model => model.Basics.LastName)
</div>
</div>
<button id="loadFromMainFrame" data-url="@Url.Action("GetFromMainFrame")">Load from mainframe</button>
<div id="MainframeContents">
<p>Contact Info will go here</p>
</div>
控制器:
public ActionResult Details(string id)
{
BasicData basicdata = new BasicData();
basicdata.FirstName = "Arya";
basicdata.LastName = "Stark";
AllData allData = new AllData();
allData.Basics = basicdata;
return View(allData);
}
public ActionResult GetFromMainframe()
{
AllData allData = new AllData();
allData.ContactPoints = …getting data from mainframe
return PartialView("ContactsSection", allData);
}
详细信息页面呈现。单击按钮会执行脚本,但不会击中控制器。我究竟做错了什么?
我还将发布我所做的其他一些尝试……</p>