asp.net mvc - Ajax Paging Mvc 4 -
i need help. i'm doing simple blog using mvc 4.
edit3: in general, concept follows: on left navigation bar categories, on right posts ajax paging. when click on concrete post, turn page details of post.
i have layout:
<body> <div class="container-fluid"> <div class="row-fluid"> <div class="sidebar-nav-fixed fill"> @html.action("getcategories","navigation") </div> <div class="sidebar-nav-fixed-stuck-left fill white"> <div class="container-fluid"> <div class="row-fluid"> <div class="span12"> <div class="content-area"> @renderbody() </div> </div> </div> </div> </div> </div> </div> </body> i return controller list of posts paging. pager creates ajax links controller:
<a data-ajax=\"true\" data-ajax-method=\"get\" data-ajax-mode=\"replace\" href=\"{0}\" data-page=\"{1}\">{2}</a> if return partial view without layout, rendered partial view, ajax paging works. if return partial view layout, rendered perfectly, ajax query works , controller return partial view,but paging doesn't work.
view
@model paginglistviewmodel<postviewmodel> @*@{ layout = "~/views/shared/_layout.cshtml"; }*@ @foreach (var post in model.items) { @html.displayfor(_ => post,"post") } @html.displayfor(x => x.pageinfo) edit: use custom pager. generates ajax links,if flag "isajax" true. method generates link each page
private string generatepagelink(string linktext, int pagenumber) { var pagelinkvaluedictionary = new routevaluedictionary(linkwithoutpagevaluesdictionary); pagelinkvaluedictionary[page] = pagenumber; var contextquerystring = requestcontext.httpcontext.request.querystring; foreach (string querystrings in contextquerystring) { if (querystrings.equals(page, stringcomparison.ordinalignorecase) || pagelinkvaluedictionary.containskey(querystrings)) continue; pagelinkvaluedictionary.add(querystrings, contextquerystring[querystrings]); } var virtualpath = routetable.routes.getvirtualpath(requestcontext, pagelinkvaluedictionary) == null ? string.empty : routetable.routes.getvirtualpath(requestcontext, pagelinkvaluedictionary) .virtualpath; return string.format( isajax ? "<li><a data-ajax=\"true\" data-ajax-method=\"get\" data-ajax-mode=\"replace\" href=\"{0}\" data-page=\"{1}\">{2}</a></li>" : "<li><a href=\"{0}\" data-page=\"{1}\">{2}</a></li>", virtualpath, pagenumber, linktext ); } edit2:
[httpget] public actionresult posts(int? page) { ... query database return ajaxpaginglist<post, postviewmodel>(posts, "postslist") } protected actionresult ajaxpaginglist<titem, tmodel>(ienumerable<titem> itemsobjects, string view) titem : class, tmodel: class { var items = automappingprovider.maptolist<titem>(itemsobjects); var catalogviewmodel = new paginglistviewmodel<tmodel> { .... } return partialview(view, catalogviewmodel); }
i solved problem. changed partial view:
@model paginglistviewmodel<postviewmodel> @{ layout = request.isajaxrequest() ? null : "~/views/shared/_layout.cshtml"; } @foreach (var post in model.items) { @html.displayfor(_ => post,"post") } @html.displayfor(x => x.pageinfo) and added attribute link data-ajax-update="...".
Comments
Post a Comment