未做页闪光灯
问题描述:
我希望我能得到这个一些想法改变视图模型属性:未做页闪光灯
林试图创建一个进出口工作在网站上的“查看更多结果”功能。目前,有10个项目的列表正在使用剃刀语法显示。
@foreach (Movie m in Model.MovieList)
{
<li>
@Html.RouteLink("Details", "Details", new { detailsId = m.Id }, new { @class = "hidden double-click-href" })
<h1>
@(m.CurrentIdentifier): @m.MovieTitle
<span class="right">@m.Movie.Description</span>
</h1>
<div class="fields">
<span class="label">Release Date</span>
<span class="value">@m.CreatedOn.ToShortDateString()</span>
<span class="label">Genre</span>
<span class="value">@m.Genre.Name</span>
</div>
</li>
}
有一个链接“显示更多结果”,单击时,将通过查询将下10个个案附加到列表中。我能想到的唯一方法就是创建一个使用JQuery的ajax调用,它将调用一个动作,返回JSON结果和我需要的信息,然后填充一个字符串,该字符串是HTML的“模板”(重复)以上使用JavaScript方法。
问题是,我不喜欢HTML基本上被复制的事实,如果我试图在调用动作期间填写MovieList属性(我需要使它成为ajax或类似的东西,以便存在没有“闪烁”),直到页面刷新才会被拾取。
是否有一个很好的方法来设置MovieList属性,以便我不必重复HTML并仍然进行ajax调用(不是页面回发)?
编辑:
我试图@Jamie迪克森的建议,而我看到的要求,我可以看到正在返回正确的HTML,它没有更新页面(页面停留完全与之前我点击链接相同)。这里是JavaScript:
function GetMovieList() {
var url = location.pathname + '/Filter';
var size = $('#my-movie-list > li').size();
$.ajax({
type: "GET",
url: url,
data: { fromNumber: size }, //the number of rows already displayed
contentType: "application/x-www-form-urlencoded",
success: function (data) {
SetShowMoreResultsFeatures(); //checks to see if the 'Show More Results' link should be disabled and some other stuff.
}
});
}
这里是控制器的方法:
[Route("/Filter")]
public ActionResult GetFilteredMovies(int fromNumber)
{
ViewData.Model = new DashboardIndexViewModel
{
CurrentUser = CurrentUser.User,
MyCalendar = new CalendarListView(CurrentUser.User),
CaseCount = movieQuery.Execute(CurrentUser.User.Id).Count(),
Movies= GetMovies(fromNumber)
};
return View("_MovieItem", ViewData.Model);
}
,这里是局部视图 “_MovieItem”:
@model Matrix.Investigator.Website.ViewModels.Dashboard.DashboardIndexViewModel
@foreach (Movie m in Model.MovieList)
{
<li>
@Html.RouteLink("Details", "Details", new { detailsId = m.Id }, new { @class = "hidden double-click-href" })
<h1>
@(m.CurrentIdentifier): @m.MovieTitle
<span class="right">@m.Movie.Description</span>
</h1>
<div class="fields">
<span class="label">Release Date</span>
<span class="value">@m.CreatedOn.ToShortDateString()</span>
<span class="label">Genre</span>
<span class="value">@m.Genre.Name</span>
</div>
</li>
}
答
把你的HTML中的部分观点,迭代集合以输出其HTML。
当您对控制器方法进行ajax调用时,让控制器返回相同的局部视图并将它传递给您的新集合。
然后,您可以简单地将返回的HTML数据放入页面的相关部分,并且不会有重复。
我更新了所有内容,虽然我可以看到正在创建的正确html,并且从请求中返回,但它并没有更新页面,所以我继续看到前10个电影,而不是我点击链接后应该看到的20个电影。我究竟做错了什么?为了让您知道,“索引”是部分视图在页面初始加载时被调用的视图的名称。任何其他想法? –
成功处理程序触发时,数据变量中的内容是什么? –
你的方法SetShowMoreResultsFeatures(),这是如何从你的ajax调用中获取数据的?这个函数里面发生了什么?我猜你需要将数据传递给它? –