2011-06-06 17 views
11

Estoy usando el plugin dataTables para una tabla en una página en la que estoy trabajando. Básicamente está buscando filas a través de una llamada ajax y en esta llamada ajax, envío los parámetros de búsqueda que el usuario selecciona y el número de página requerido. Necesito los botones Siguiente, Anterior, Primero y Último para activar también la misma llamada ajax, pero con diferentes números de página, ya que el interceptor de fondo depende del número de página.Paginación usando Ajax en tablas de datos jquery

Esta llamada api devolverá un total de no. de filas (digamos 1000) que pertenecen para estos parámetros de búsqueda y las filas con el tamaño de página (digamos 50).

¿Hay alguna manera, puedo usar la tabla de datos para hacer esto?

+0

Estoy hablando de este plugin - http://www.datatables.net – kshtjsnghl

Respuesta

4

Sí se puede hacer eso,

En primer lugar, echar un vistazo en detalle here

y luego activar la API para mostrar correctamente los botones, etc que desee.

Estoy usando el mismo complemento en proyectos muy grandes y funciona sin problemas.

el tipo de configuración que uso en mi mesa es la siguiente

$("#mytable").dataTable({"bJQueryUI": true,"sPaginationType": "full_numbers"}); 
+0

no estoy claro en cuanto a cómo utilizar este plugin para llamadas Ajax a través de JavaScript. Además, todo lo que se necesita del lado del servidor para que esto funcione. – kshtjsnghl

+0

todo lo que necesita es un archivo php para procesar sus consultas y devuelve un conjunto de resultados codificados json. En el sitio web de datatables hay varias demos al respecto. –

4

Sí, se puede completar esto y lo he hecho en un número de sitios. La clave es que la inicialización adecuada de la tabla de datos con código como este:

var oTable = ""; 

$(document).ready(function() { 
    oTable = $('#htmltableID').dataTable({ 
     "sPaginationType": "full_numbers", 
     "bServerSide": true, 
     "sAjaxSource": "/script-to-accept-request.php", 
     "sServerMethod": "POST", 
     "iDisplayLength": 50 
    }); 
} 

Una vez que se carga la página se enviará una solicitud POST a la fuente indicada. La solicitud por defecto usa el método GET, pero elijo publicar esos valores en su lugar.

Puede añadir variables personalizadas que se incluirán en el valor predeterminado establecido por referencia a http://www.datatables.net/release-datatables/examples/server_side/custom_vars.html

El código del lado del servidor que se llevará a la solicitud tendrá que manejar la variable iDisplayStart cuando se cambia la página. Esto comienza en 0 y luego aumenta en el valor de iDisplayLength con cada página. El ejemplo dado por Oliver incluye un ejemplo con el lado del servidor PHP, por lo que sería realmente útil revisarlo.

2

me ha escrito una entrada de blog en Server-Side Paging with PetaPoco and DataTables y poner una correspondiente MVC3 ASP.NET muestra en la solución C# en GitHub

No he visto una referencia a su lenguaje de servidor, pero la solución C# ilustra el servidor- Interacción Json lateral de recibir la POST ajax de DataTables, consultar la base de datos y formatear la respuesta Json para DataTables para procesar la respuesta.

Espero que esto ayude.

-3

intente esto ... Estoy seguro de que esto funcionará para usted.

$("#myDataTable").dataTables({ 
    "bJQueryUI":true, 
     "bSort":false, 
     "bPaginate":true, // Pagination True 
     "sPaginationType":"full_numbers", // And its type. 
     "iDisplayLength": 10 
}); 
+1

Lea la pregunta del cartel. Tu respuesta no está aún más cerca de lo que preguntó. –

Cuestiones relacionadas