jqueryasp.net-mvcasp.net-mvc-3pagination

How can i do paging in asp.net mvc3?


I am working on asp.net mvc3 application and have many records coming from database. I want to display only 10 records first then user can click on button to see next 10 records and so on... Like facebook wall posting more records.

How can I implement this thing in my application using jQuery and ajax?

How can I control display data in view using paging?

I am using this to get 10 records but I want to display all records using more record button

var Entity = (from a
    in context.Data
    where <Condition>
    select a).Take(10);

Solution

  • The following articles should give you an idea :

    http://weblogs.asp.net/andrewrea/archive/2008/07/01/asp-net-mvc-quot-pager-quot-html-helper.aspx

    http://weblogs.asp.net/gunnarpeipman/archive/2010/02/21/simple-pager-for-asp-net-mvc.aspx

    On the other hand, you can implement it like this :

    Get the nuget package called TugberkUg.MVC

    Then, your controller should look like below :

        public ActionResult Index(int page = 0) {
    
            const int pageSize = 10;
    
            #region _filter the model
    
            IQueryable<myModel> model = _myrepo.GetAll()
    
            #endregion
    
            #region _convert the model to paginatedList
    
            var paginatedModel = 
                new TugberkUg.MVC.Helpers.PaginatedList<myModel>(model, page, pageSize);
    
            #endregion
    
            return View(paginatedModel);
        }
    

    And, here how your controller should look like :

    @model TugberkUg.MVC.Helpers.PaginatedList<myModel>
    
    @foreach(var item in Model) { 
    
         <p>@item.id</p>
    
    }
    

    You need to handle the pager as well and here is a sample for you :

    ASP.NET MVC PaginatedList Pager - Put wise "..." after certain point

    This TugberkUg.MVC.Helpers.PaginatedList class will provide all the necessary fields for pager.