¿Redibujar tablas de datos después de usar ajax para actualizar el contenido de la tabla?

Ya no tienes que indagar más en otras páginas porque estás al espacio adecuado, poseemos la respuesta que buscas pero sin liarte.

Solución:

Parece como si pudieras usar las funciones de la API para

• borrar la tabla ( fnClearTable )
• agregar nuevos datos a la tabla (fnAddData)
• redibujar la tabla (fnDraw)

http://datatables.net/api

ACTUALIZAR

Supongo que está utilizando la fuente de datos DOM (para el procesamiento del lado del servidor) para generar su tabla. Realmente no entendí eso al principio, por lo que mi respuesta anterior no funcionará para eso.

Para que funcione sin tener que volver a escribir el código del lado del servidor:

Lo que deberá hacer es eliminar por completo la tabla anterior (en el dom) y reemplazarla con el contenido del resultado de ajax, luego reinicie la tabla de datos:

// in your $.post callback:

function (data) 

    // remove the old table
    $("#ajaxresponse").children().remove();

    // replace with the new table
    $("#ajaxresponse").html(data);

    // reinitialize the datatable
    $('#rankings').dataTable( 
    "sDom":'t<"bottom"filp><"clear">',
    "bAutoWidth": false,
    "sPaginationType": "full_numbers",
        "aoColumns": [ 
         "bSortable": false, "sWidth": "10px" ,
        null,
        null,
        null,
        null,
        null,
        null,
        null,
        null,
        null,
        null,
        null
        ]

     
    );

Intenta destruir la tabla de datos con bDestroy:true Me gusta esto:

$("#ajaxchange").click(function()
    var campaign_id = $("#campaigns_id").val();
    var fromDate = $("#from").val();
    var toDate = $("#to").val();

    var url = 'http://domain.com/account/campaign/ajaxrefreshgrid?format=html';
    $.post(url,  campaignId: campaign_id, fromdate: fromDate, todate: toDate,
            function( data )  

                $("#ajaxresponse").html(data);

                oTable6 = $('#rankings').dataTable( "bDestroy":true,
                    "sDom":'t<"bottom"filp><"clear">',
                    "bAutoWidth": false,
                    "sPaginationType": "full_numbers",
"aoColumns": [ 
         "bSortable": false, "sWidth": "10px" ,
        null,
        null,
        null,
        null,
        null,
        null,
        null,
        null,
        null,
        null,
        null
        ]

 
);
            );

);

b Destruir: true primero destruirá una instancia de tabla de datos asociada con ese selector antes de reiniciar uno nuevo.

No estoy seguro de por qué. Pero

oTable6.fnDraw();

Funciona para mi. Lo pongo en la siguiente línea.

---

---

Utiliza Nuestro Buscador