ejemplos - jquery table example

Envíe todos los datos de la tabla jQuery DataTables paginada al lado del servidor en lugar de solo a la página actual (1)

Explicación sobre el resultado que no entendiste.

location=Barangay+1&ageGroup=All+Ages&bothSexes=2197&male=1086&female=1111&location=Barangay+1&ageGroup=Under+1&bothSexes=42&male=17&female=25&location=Barangay+1&ageGroup=1+-+4&bothSexes=169&male=88&....

La función de serialize de jQuery toma elementos de forma y crea a partir de ellos una cadena que está lista para enviar al servidor. La función serializar funciona solo en los elementos de formulario ( <input> , <textarea> , <select> ), por lo que en el ejemplo de código anterior - el resultado de la table.$(''input, select'').serialize() era <input> y <select> que están dentro de los datos y los serializan (hacen de ellos una cadena que está lista para ser enviada al servidor).

Uno de los problemas de uso es el hecho de que la paginación de Datatables no tendrá todos los elementos disponibles en el dominio, por lo que el selector solo obtendrá algunos de ellos.

Cómo obtener todos los datos de Datatables al usar la paginación

Al usar la paginación, solo la página actual que se muestra es "compilación" dentro del DOM, lo que significa que, si envía un formulario que contiene la tabla, solo se enviarán los campos que están dentro de esa página.

Para enviar todos los datos, deberá utilizar la API de los datos.
Para obtener todos los datos de las Tablas de datos, incluso si los datos se dividieron en páginas, puede usar la función de data() :

table.DataTable().data()

El resultado de esa función será un objeto que puede utilizar para extraer todos los datos de todas las páginas en la tabla de datos. Tenga en cuenta que puede usar la función JSON.stringify para obtener la cadena json-ready que puede usar para enviar al servidor.

$(function() { t = $(''#example'').DataTable( { "pagingType": "full_numbers" }); $(''#get-result'').click(function() { $(''#result'').val(JSON.stringify(t.data())); }); });

JSON.stringify(t.data()) También le proporcionará más información sobre la instancia de Datatable. Si solo quieres los datos puros, puedes filtrarlos:

ar = []; for (var i = 0; i < t.data().length; i++) { ar[i] = t.data()[i]; } json = JSON.stringify(ar);

Sin embargo, todavía tiene problemas aquí si su tabla contiene campos de formulario, ya que la función data() no devolverá el valor, sino la cadena <input name=X value=Y> .

Para cambiar, necesitará una función especial para obtener todos los elementos dentro de la tabla y convertirlos "manualmente":

Cómo obtener todos los datos de Datatables con elementos de formulario al usar la paginación

Para obtener los valores de los elementos de un formulario dentro de una base de datos paginada, necesitará extraer los elementos del formulario utilizando la API y obtener los valores de ellos.

Aquí hay un ejemplo de cómo hacerlo:

$(function() { t = $(''#example'').DataTable( { "pageLength" : 5, "pagingType": "full_numbers" }); $(''#get-result'').click(function() { ar = $() for (var i = 0; i < t.rows()[0].length; i++) { ar = ar.add(t.row(i).node()) } $(''#result-serialized'').val(ar.find(''select,input,textarea'').serialize()); json_obj = {} ar.find(''select,input,textarea'').each(function(i, el) { json_obj[$(el).attr(''name'')] = $(el).val(); }); $(''#result-json'').val(JSON.stringify(json_obj)); }); });

Para publicar los valores en el servidor (por ejemplo, utilizando la solicitud de publicación ajax de jquery) puede usar cualquiera de las dos versiones:

$(''#submit-form-btn'').click(function() { // Option 1: using the serialized version ar = $() for (var i = 0; i < t.rows()[0].length; i++) { ar = ar.add(t.row(i).node()) } $.ajax({ type: "POST", url: ''url-to-post'', data: ar.find(''select,input,textarea'').serialize(), success: function() { //do something } }); // Option 2: using the object we just created: json_obj = {} ar.find(''select,input,textarea'').each(function(i, el) { json_obj[$(el).attr(''name'')] = $(el).val(); }); $.ajax({ type: "POST", url: ''url-to-post'', data: json_obj, success: function() { //do something } }); });

Tengo un formulario con la tabla jQuery DataTables. Una vez enviado, obtendrá todos los datos y los guardará en la base de datos. Sin embargo, cuando estoy usando la paginación, entonces solo se guardarán los datos de la página actual y no otras.

Traté de hacer esto,

$(''#uploadClicked'').click(function() { var table = $(''#dataTable-ageGroup'').DataTable(); var data = table.$(''input, select'').serialize(); var json = JSON.stringify(data); document.getElementById(''json'').setAttribute(''value'', json); alert("The following data would have been submitted to the server:/n/n" + data); document.getElementById(''UploadDb'').submit(); return false; });

pero el resultado está en una forma que no entiendo.

Si esta es la única forma sin utilizar Ajax, ¿cómo puedo traducir estos datos al formato JSON? ¿O es tres otra forma de convertir esos datos en un objeto?