asp.net mvc3中的“阅读更多”按钮

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 ? I am using this to get 10 records but I want to display all records using more record button

Answer 1

This should get you going...

---

Assuming:

public class PostsViewModel
{
    public IEnumerable<PostViewModel> Posts { get; set; }
}

Your controller might look like:

public class BlogController
{
    public ActionResult Index()
    {
        PostsViewModel model = new PostsViewModel 
        {
            Posts = postService.GetPosts(resultsPerPage: 10, page: 1)
        };
        return View(model);
    }

    public PartialViewResult More(Int32 page = 1)
    {
        PostsViewModel model = new PostsViewModel 
        {
            Posts = postService.GetPosts(resultsPerPage: 10, page: page)
        };
        return PartialView(model);
    }
}

And Views something like:

~/Views/Blog/Index.cshtml

@model PostsViewModel
@* Other page content *@
@Html.DisplayFor(x => x.Posts)
<div id="more"></div>
@Ajax.ActionLink("Read More", "More", "Blog", new AjaxOptions {
    InsertionMode = InsertionMode.InsertBefore,
    UpdateTargetId = "more"
})
@* Other page content *@

~/Views/Blog/More.cshtml

@model PostsViewModel
@Html.DisplayFor(x => x.Posts)

~/Views/Blog/DisplayTemplates/PostViewModel.cshtml

@model PostViewModel
@* Display post itself *@