Tengo la siguiente línea de código que usa PagedListPager de html helper:
@Html.PagedListPager(Model.kyc_paged_list, page => Url.Action("ClientDetails", new { id = ViewBag.ID, kyc_page = page, transaction_page = Model.transaction_page, active = "kyc" }))
Al hacer clic en el buscapersonas, se recarga toda la página. Pero solo quiero que se actualice la tabla con id="kyc-history" .
Sé cómo volver a cargar la tabla usando una función de JavaScript, pero no sé cómo llamarla desde PagedListPager . ¿Alguna idea de cómo puedo llamarlo? Digamos que la función JS se llama reloadTable()
Estaba teniendo el mismo problema y este artículo (hecho por Anders Lybecker) me ayudó y ¡ahora todo funciona! Es muy claro con los pasos, ¡pero asegúrese de hacer una copia de seguridad antes de comenzar!
Eche un vistazo: Paginación AJAX para sitios ASP.NET MVC
En resumen, realiza 2 resultados de acción en su controlador con 2 vistas, 1 para su página (en mi caso, es la vista de índice) y la otra para la lista que contiene el control PagedListPager (vista de lista). Y coloque la vista de lista dentro de la vista de índice. Y escriba el código JQuery para PagedListPager en la vista de índice.
¡Puedes leer el artículo para más detalles!
Y este es mi código con algunas cosas extra que noté para ayudarte más:
La vista de lista:
@model IPagedList<StudentRegSys.Models.Student> @{ Layout = null; } @using PagedList.Mvc; @using PagedList; <link href="https://fonts.googleapis.com/css?family=Open+Sans:400italic,400,600,700" rel="stylesheet"> @Styles.Render("~/template/css") <div class="container"> <div class="row"> <!-- The List Code--> <div class="pagination-control"> @Html.PagedListPager(Model, i => Url.Action("List", "Home", new { i, search = Request.QueryString["search"] })) </div> </div> </div> @Scripts.Render("~/template/js") Nota: asegúrese de hacer Layout = null; y coloque los enlaces de estilos y el manual de scripts en esta vista para evitar problemas de diseño.
En el controlador: (es el controlador de inicio en mi caso)
// GET: /Home/Index public ViewResult Index() { return View(); } // GET: /Home/List public ActionResult List(int? i, string search = "") { try { var students = _context.Student.Include(s => s.Major) .OrderBy(s => s.Name) .Where(s => s.Name.Contains(search) || s.Major.Name.Contains(search) || s.Address.Contains(search) || s.Phone.Contains(search)) .ToList().ToPagedList(i ?? 1, 8); return View(students); } catch (Exception) { return HttpNotFound(); } }La vista de índice:
@{ ViewBag.title = "Home"; } <section id="intro"> <!-- Some Code --> </section> <section id="maincontent"> @Html.Action("List") <!-- to call the List view --> </section> <script> $(document).ready(function () { $(document).on("click", ".pagination-control a[href]", function () { $.ajax({ url: $(this).attr("href"), type: 'GET', cache: false, success: function (result) { $('#maincontent').html(result); } }); return false; }); }); </script> Nota: Asegúrese de poner el html (resultado) en el contenedor raíz de la lista en mi caso fue <section id="maincontent"> .
Espero que esto te ayude :)