Estoy usando DataTables para mostrar datos de una función de búsqueda. Estoy seguro de que este era el método previsto para pasar datos a DataTables. Estoy inicializando DataTable con una matriz de javascript en blanco. Luego quiero llenar Datatables en una función diferente.
Probé $().DataTable().ajax.reload() y $().DataTable().fnAddData(dataSet) pero ninguno funcionó.
https://jsfiddle.net/owxz7e22/3/
<table id="test" class="table table-striped table-bordered table-hover dt-responsive"> </table> <a href="#" onclick="LoadData();">Test</a> $(document).ready(function () { $('#test').DataTable({ data: dataSet, columns: [ { title: "Name" }, { title: "Position" }, { title: "Office" }, { title: "Extn." }, { title: "Start date" }, { title: "Salary" } ] }); }); var dataSet = []; function LoadData() { dataSet = [ ["Tiger Nixon", "System Architect", "Edinburgh", "5421", "2011/04/25", "$320,800"], ["Garrett Winters", "Accountant", "Tokyo", "8422", "2011/07/25", "$170,750"], ["Ashton Cox", "Junior Technical Author", "San Francisco", "1562", "2009/01/12", "$86,000"], ]; var tbl = $('#test').DataTable(); tbl.fnClearTable(); tbl.fnDraw(); tbl.fnAddData(dataSet); //$('#test').DataTable().ajax.reload(); }Debe almacenar su tabla de datos en una variable y agregar filas: mire aquí: https://jsfiddle.net/63235xk2/
$(document).ready(function () { var dataSet = []; var datatable = $('#test').DataTable({ data: dataSet, columns: [ { title: "Name" }, { title: "Position" }, { title: "Office" }, { title: "Extn." }, { title: "Start date" }, { title: "Salary" } ] }); $('.asd').on('click',function(){ dataSet = [ ["Tiger Nixon", "System Architect", "Edinburgh", "5421", "2011/04/25", "$320,800"], ["Garrett Winters", "Accountant", "Tokyo", "8422", "2011/07/25", "$170,750"], ["Ashton Cox", "Junior Technical Author", "San Francisco", "1562", "2009/01/12", "$86,000"], ]; alert(dataSet.length); datatable.clear(); datatable.rows.add(dataSet); datatable.draw(); }); });Al definir una función de devolución de llamada ajax, es posible cargar desde datos de una matriz o cualquier otra fuente de datos, simplemente usando la función ajax.reload datatable .
Además, esta solución mantiene el estado de las filas existentes.
Ejemplo:
var table = $('#mytable').DataTable({ ,ajax: function (data, callback, settings) { callback({ data: table_data }) //reloads data } }); //at some event, reload the table $(#some-button).on('click', function () { table.ajax.reload(); }