No ejecuta la petición AJAX al cargar la página porque está dentro de una función anónima y solo se ejecuta por los eventos a los que fue asignada. Necesitas: * Definir la función aparte * Al cargar el DOM: * Asignar el evento a los checkboxes, pero ejecutando la función * Ejecutar la función para obtener productos desde que carga la página * Para la paginación: * Crear variable global para la página que se debe mostrar * Incluir la página en la petición * [Delegar evento onclick](https://api.jquery.com/on/#on-events-selector-data-handler) en enlaces de paginación <!-- Fin de lista --> // Variable global para asignar página let curPage = 1; // Ejecutar hasta que se haya cargado el DOM $(function() { // Asignar evento a checkboxes $('[name="categoria[]"], [name="subcategoria[]"], [name="marcas[]"], [name="genero[]"], #search').bind('click keyup', function(event) { cargarProductos(); }); // Delegar evento onclick para enlaces de paginación $('#filtrados').on('click', '.page-link', function(e) { // Evitar comportamiento normal de enlace e.preventDefault(); // Actualizar página que se debe mostrar curPage = $(this).text(); // Ejecutar petición AJAX cargarProductos(); }); // Ejecutar cuando carga el DOM cargarProductos(); }); // Función para petición AJAX function cargarProductos() { $value= $("#search").val(); var categoria = $('[name="categoria[]"]:checked').map(function(){ return this.value; }).get(); var subcategoria = $('[name="subcategoria[]"]:checked').map(function(){ return this.value; }).get(); var marca = $('[name="marcas[]"]:checked').map(function(){ return this.value; }).get(); var genero = $('[name="genero[]"]:checked').map(function(){ return this.value; }).get(); var url = 'productos/filtros'; $.ajax({ headers: { 'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content') }, type: "POST", url: url, data: {'categoria': categoria, 'subcategoria': subcategoria, 'marca': marca, 'genero': genero, 'search': $value, // Incluir número de página que se va a cargar 'page': curPage }, beforeSend: function(){ $("#filtrados").html("<div id='loader'></div>") }, timeout:500000, success: function (resultado){ setTimeout(function(){ // Asignar contenido HTML $("#filtrados").html(resultado); }, 1000); }, error: function(e) { $("#filtrados").html("Sucedió un error!") } }); };