0

我是新手ASP.NET MVC，所以请帮我解决这个乍一看很简单的问题。

我有一张学生表，下面有View一个Load More链接。通过单击此链接，我需要使用 AJAX 加载更多学生记录。

所以这是我的View（省略不必要的数据）

<table id="studentTable">
    <thead>
        ...
    </thead>
    <tbody>
        @Html.Partial("_StudentDetailsList", Model)
    </tbody>
</table>
@Ajax.ActionLink("Load More", "LoadMoreStudents", new AjaxOptions
{
    HttpMethod = "POST",
    InsertionMode = InsertionMode.InsertAfter,
    UpdateTargetId = "studentTable"
})

_StudentDetailsList显示学生的局部视图

@model IEnumerable<MvcApplication1.Models.Student>
@foreach (var item in Model)
{
    <tr>
        <td>
            @Html.DisplayFor(modelItem => item.LastName)
        </td>
        <td>
            @Html.DisplayFor(modelItem => item.FirstName)
        </td>
    </tr>
}

行动

public ActionResult LoadMoreStudents(int skip = 0)
{
    return PartialView("_StudentDetailsList", studentRepository.Get(orderBy: s => s.OrderBy(st => st.FirstName).OrderBy(st => st.LastName)).Skip(skip).Take(10));
}

如您所见，我想每次加载接下来的 10 个学生，但我必须知道已经加载了多少。所以问题是：我应该从哪里得到这个skip我想传递给的Action参数View。我如何计算View已经加载了多少局部视图以及每个局部视图有多少学生？或者将此参数传递给操作是一种不好的做法，也许我应该在其他地方处理它（例如某些服务）？请建议正确的方法来做到这一点。谢谢。

PS请随意编辑标题，因为我想不出合适的标题。

4

2 回答 2

0

最简单的方法是为您创建一个包含这些变量的 ViewModel。

视图模型

public class YourViewModel(){

    public int skip {get;set;}

    public IEnumerable<StudentDetails> StudentDetailList {get;set;}

}

控制器/动作方法

public ActionResult LoadMoreStudents(int skip = 0)
{
    return PartialView("_StudentDetailsList", new YourViewModel{
      StudentDetailList = studentRepository.Get(orderBy: s => s.OrderBy(st => st.FirstName).OrderBy(st => st.LastName)).Skip(skip).Take(10),
      skip = skip + 10});
}

视图 @Html.Partial("_StudentDetailsList", Model.StudentDetailList)

局部视图

@model MvcApplication1.Models.YourViewModel
<table id="studentTable">
    <thead>
        ...
    </thead>
    <tbody>    
  @foreach (var item in Model.StudentDetailList)
   {
    <tr>
        <td>
            @Html.DisplayFor(modelItem => item.LastName)
        </td>
        <td>
            @Html.DisplayFor(modelItem => item.FirstName)
        </td>
    </tr>
}
    </tbody>
    </table>
    @Ajax.ActionLink("Load More", "LoadMoreStudents", new {skip = Model.skip}, new AjaxOptions
    {
        HttpMethod = "POST",
        InsertionMode = InsertionMode.InsertAfter,
        UpdateTargetId = "studentTable"
    })

基本上，您必须能够使用从控制器返回的值动态更新 Ajax.ActionLink。在这里，我将它移到了 PartialView 中（可以说您可以将整个表（包括获取更多链接）移到 PartialView 中，让它更干净）。

于 2012-08-30T15:35:58.080 回答
0

你在路上。您应该将链接的 Ajax.ActionLink 替换为 $.get，并通过计算您已经拥有的 tbody 处的行数来检索跳过：

首先将 ActionLink 替换为：

<a href="#" id="mylink">Load More Students here!</a>

其次，创建这个函数来做 get：

$('mylink').click(function (e) {
    e.preventDefault();
    //Gets the number of rows that you alredy have loaded
    var rowCount = $('studentTable').find('tbody > tr').length;
    //The URL for the get, with the number of rows
    var url = "http://www.myurl.com/controller/action?skip=" + rowCount;

    $.get(url, function (data) {
       //Append the content from the partial view to the tbody
       $('studentTable').find('tbody').append(data);
    });
});

我认为这也是一个好方法！

希望这对你有帮助！

于 2013-07-11T18:22:55.493 回答