Data page of MVC Learning: Using component Pagedlist.mvc

Preparatory work:

Install the PAGEDLIST.MVC component in the Manage NuGet packages for your project.

Set up the following:

Specific implementation

Background controller code:

usingPaging.models;usingSystem;usingSystem.Collections.Generic;usingSystem.Linq;usingsystem.web;usingSYSTEM.WEB.MVC;usingpagedlist; Be sure to introduce this namespaceusingSystem.Data;namespacepaging.controllers{ Public classPagingcontroller:controller {PrivateComputerentities db =NewComputerentities ();//get the database context        /// <summary>        ///Data Display/// </summary>        /// <param name= "P" >Current Page</param>        /// <returns>when the page's data</returns>         PublicActionResult Index (intp =1)           {            vardata = Db.ComputerInfo.ToList ();//get the data source//P: Indicates the current page, 2: Number of data bars displayed per page            varPagedata = data. Topagedlist (pagenumber:p,pagesize:2); returnView (pagedata); }        /// <summary>        ///Edit Data/// </summary>        /// <param name= "id" ></param>        /// <returns></returns>         PublicActionResult Edit (intId=0)        {            vardata =db.ComputerInfo.Find (ID); if(Data! =NULL)            {                returnView (data); }            Else            {                returnHttpnotfound (); }} [HttpPost] Publicactionresult Edit (ComputerInfo cinfo) {if(modelstate.isvalid) {db. Entry (Cinfo). State=entitystate.modified; Db.            SaveChanges (); }            returnRedirecttoaction ("Index"); }        /// <summary>        ///Delete Data/// </summary>        /// <param name= "id" ></param>        /// <returns></returns>[HttpPost] PublicActionResult Delete (intID) {varCinfo =db.ComputerInfo.Find (ID); if(cinfo!=NULL) {db.ComputerInfo.Remove (cinfo); Db.            SaveChanges (); }            returnRedirecttoaction ("Index","Paging"); }        /// <summary>        ///Data Details/// </summary>        /// <param name= "id" ></param>        /// <returns></returns>         PublicActionResult Details (intID) {vardata =db.ComputerInfo.Find (ID); returnView (data); }    }}

Front page:

Index: Data presentation page "related to paging"

@using pagedlist//Remember to introduce @using PAGEDLIST.MVC//Remember to introduce @model IEnumerable<Paging.Models.ComputerInfo>@{Viewbag.title="Data Display page";} @{    varAjaxoptions =Newajaxoptions () {onsuccess="OK", OnFailure="Failure", Confirm="Are you sure you want to delete this message? ", HttpMethod="Post"        };} @section scripts{@Scripts. Render ("~/bundles/jqueryval")    <script>function OK () {alert ("Delete Success! ");        Location.reload (); } function Failure () {alert ("Delete failed! "); }    </script>}@Html. Displaynamefor (Model=model. Name)</th> <th>@Html. Displaynamefor (Model=model. Price)</th> <th></th> </tr>@foreach (varIteminchModel) {    <tr> <td>@Html. Displayfor (ModelItem=item. Name)</td> <td>@Html. Displayfor (ModelItem=item. Price)</td> <td>@Html. ActionLink ("Edit","Edit",New{Id=item. Id}) |@Html. ActionLink ("Details","Details",New{Id=item. Id}) |@Ajax. ActionLink ("Delete","Delete",New{id =item. Id}, Ajaxoptions)</td> </tr>}</table>
Here are the things that are involved in paging <link href="~/content/pagedlist.css"Rel="stylesheet"/>//Style@{    vardata = Model asipagedlist<paging.models.computerinfo>;//get the data source} @Html. Pagedlistpager (List:data, Generatepageurl:page= Url.action ("Index",New{p=page})) Paging links

Edit page:

@model paging.models.computerinfo@{viewbag.title="Data editing page";}@using (Html.BeginForm ()) {@Html. AntiForgeryToken () @Html. ValidationSummary (true)    <fieldset> <legend> @Model. Name's edit page </legend>@Html. Hiddenfor (Model=model. ID)<divclass="Editor-label">@Html. Labelfor (Model=model. Name)</div> <divclass="Editor-field">@Html. Editorfor (Model=model. Name) @Html. Validationmessagefor (Model=model. Name)</div> <divclass="Editor-label">@Html. Labelfor (Model=model. Price)</div> <divclass="Editor-field">@Html. Editorfor (Model=model. Price) @Html. Validationmessagefor (Model=model. Price)</div> <p> <input type="Submit"Value="Save"/> </p> </fieldset>}<div>@Html. ActionLink ("Home Page","Index")</div>@section Scripts {@Scripts. Render ("~/bundles/jqueryval")}

Details page:

@model paging.models.computerinfo@{viewbag.title="Data Detail Page";}class="Display-label">@Html. Displaynamefor (Model=model. Name)</div> <divclass="Display-field">@Html. Displayfor (Model=model. Name)</div> <divclass="Display-label">@Html. Displaynamefor (Model=model. Price)</div> <divclass="Display-field">@Html. Displayfor (Model=model. Price)</div></fieldset><p>@Html. ActionLink ("Edit","Edit",New{id=model.id}) |@Html. ActionLink ("Home Page","Index")</p>

Summary:

Using the Pagedlist component for paging: The main steps are:

1, in the background code introduced: using Pagedlist; namespaces, while obtaining data source "Note that the type of the data source must be converted to IEnumerable or IQueryable, or inherit the subclass of these two types can also": data.

2, through the var pagedata = data. Topagedlist (pagenumber:p,pagesize:2) Gets the result information after pagination: where PageNumber: Indicates the current page, PageSize: Represents the number of pieces of data displayed per page.

3. The following two namespaces are introduced at the top of the page:

@using pagedlist

@using PAGEDLIST.MVC

4. When the Pagedlist component is installed, under the content folder of the project, there will be a pagedlist.css style sheet that is required for the default paging, referencing it before using @html.pagedlistpager. Will make the pagination more beautiful

5, on the View page through @html.pagedlistpager (list:data, generatepageurl:page = Url.action ("Index", new {p=page})) The paging navigation link required for the auxiliary method output paging. Where list: corresponds to the data "controller to the data on the page", but this type to be converted to ipagedlist<t> type. , Generatepageurl: is the pager link.

Write blog, convenient and convenient for people who need! *_*!

Data page of MVC Learning: Using component Pagedlist.mvc