Question

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);

Answer 1

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.