Dans mon travail précédent, j'ai utilisé beaucoup de pagination, mais il n'a pas été solide, il n'est donc pas facile à utiliser. Il s'agit d'une pagination avec rafraîchissement partiel. J'ai beaucoup essayé. Je voulais utiliser MVCPager pour un rafraîchissement partiel, mais étant donné que le coût est trop élevé, j'ai abandonné. Résumons d'abord la pagination basée sur Bootstrap, afin qu'il puisse être pratique pour moi à utiliser à l'avenir
Adresse open source https://github.com/lyonlai/bootstrap-paginator
Cite d'abord
Jquery
bootstrap.min.js
bootstrap-paginator.min.js
Code de contrôleur
[AutorisationCodeAtTribute] [Description ("Informations de commentaire")] [HTTPPOST] Commentaire ActionResult Public (int id, int? Page) {# Region Commentaire Liste var dal = new CarCommentOperator (); int pageIndex = page ?? 1; // Page actuelle if (! String.isnullorempty (request.QueryString ["PageIndex"])) {if (! Int.tryParse (request.querystring ["PageIndex"], out PageIndex)) {PageIndex = 1;}} const int pagesize = 2; Long totalCount; LongPageCount; IEnumerable <CarComment> list = dal.getList (PageIndex, PageSize, Out totalPageCount, out totalCount, "carid =" + id); var commentipagedList = new StaticPagedList <CarComment> (List, PageIndex, PageSize, convert.toint32 (totalCount)); # EndRegion // Convert to Json Format var Sttrrsult = "{/" PageCount / ":" + commentipagedList.pageCount + ", /" currentPage / ":" + commentIpagedList.pageNumber + ", /" list / ":" + jsonconvert.serializeObject (list) + "}"; retourner JSON (strresult, jsonrequestbehavior.allowget);}Code JS
<script type = "text / javascript"> $ (document) .ready (function () {var carid = 1; $. ajax ({url: "/ car / comment", dataType: 'json', type: "post", data: "id =" + carid, succès: function (data) {if (data! = null) {$.. {// Transtraiteur le JSON renvoyé $ ("# list"). APPEND ('<Ball>'); $ ("# list"). append ('<tr>'); $ ("# list"). append ('<td> commentateur </td>'); $ ("# list"). APPEND ('<Td>' + item.UserProfiled + '</td>'); $ ("# list"). '); $ ("# list"). append (' <tr> '); $ ("# list"). append (' <td> contenu </td> '); $ ("# list"). A SPEND (' <Td> '+ item.content +' </td> '); $ ("# list"). }); EVAL (("+ Data +") "). CurrentPage; "Page d'accueil"; cas "prev": return "page précédente"; cas "next": return "page suivante"; cas "dernier": return "dernière page"; case "page": page de retour;} //} // pageurl: function (type, page, actuel) {// return "/ Car / Détails? Page =" + page;}, // Click Event onPageCLICKED: function (event, originale $ .ajax ({url: "/ car / comment? id =" + carid, type: "post", data: "page =" + page, succès: function (data1) {if (data1! = null) {$ ("# list"). html (""); $.. $ ("# list"). APPEND ('<Table Style = "Border: 1px Solid # 00CED1; Largeur: 300px "> '); $ (" # list "). Append (' <tr> '); $ (" # list "). Append (' <td> commentateur </td> '); $ (" # list "). APPEND (' <TD> '+ item.UserProfileId +' </td> '); $ (" # list "). $ ("# list"). append ('<tr>'); $ ("# list"). append ('<td>'); $ ("# list"). APPEND ('<td>' + item.content + '</td>'); $ ("# list"). APPEND ('</tr>'); $ ("# list"). });}}});}}; element.bootstrappaginator (options);}}});});Ce qui précède est le rafraîchissement de la page basé sur le bootstrap qui vous a présenté par l'éditeur. J'espère que cela vous sera utile. Si vous avez des questions, veuillez me laisser un message et l'éditeur vous répondra à temps. Merci beaucoup pour votre soutien au site Web Wulin.com!