使用Skip（）和Take動態加載數據@ Ajax.ActionLink

我是ASP.NET MVC的新手，所以請幫助我解決這個乍一看簡單的問題。使用Skip（）和Take動態加載數據@ Ajax.ActionLink

我有一張我的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名學生，但我必須知道有多少人ady加載。所以問題是：我應該從哪裏得到這個skip參數，我想從View傳遞給Action。我怎麼能指望View已經加載了多少部分視圖，以及每個部分有多少個學生？或者將這個參數傳遞給action是一種不好的做法，也許我應該在其他地方處理它（例如某種服務）？請建議正確的方法來做到這一點。謝謝。

P.S.請隨時編輯標題，因爲我無法提供適當的標題。

來源

2012-08-30 Zabavsky

最簡單的方法是創建一個包含這些變量的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-30 15:35:58 Tommy

如果這沒有ajax，我總是返回'View'就沒有問題。但是，您將'ViewModel'傳遞給'PartialView'，而不是'View'，將'skip'計數。而'View'有它自己的'ViewModel'，其中'skip'總是等於10.我怎樣才能從'View'的'PartialView'中獲得'skip'？ – Zabavsky

將您的Ajax.ActionLink放入_StudentDetailsList的部分視圖中。 – Tommy

我不認爲這樣分割表是個好主意。當第一次加載'View'時，它是可以的，但是我將有一個'

'標籤和多個帶有多個'Load More'鏈接的'

'標籤。 – Zabavsky

你正在路上。您應該用$替換Ajax.ActionLink鏈接。得到的，並通過在TBODY計算行數檢索跳過你已經有：

首先更換的ActionLink爲：

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

二，創建這個功能做得到：

$('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-11 18:22:55 Fals

使用Skip（）和Take動態加載數據@ Ajax.ActionLink

回答

相關問題