Change data source from variable to ajax dinamicaly

koa73

Link to test case:
Debugger code (debug.datatables.net):
Error messages shown:
Description of problem:

Is it possible to set first load data from local variable, which I've load during make this page, but then set ajax source data. I wanna load start page with static data, but don't wont to create table on the server side

Thx

kthorngren

You can use data to load the data during initialization, see this example. Or you can use row.add() (1 row) or ``-api rows.add()` (multiple rows) to add the rows after Datatables has been initillaized.

Kevin

koa73

If I set ajax option the table will be initialized from ajax request. If I set data options, I should table filling processing by my self May be I did't understand your answer

kthorngren

Maybe I don't understand the question

You are wanting to load the initial data from a local Javascript variable, correct? If so my response explains how.

Are you then wanting to use ajax for loading subsequent data? If so please explain your requirements and how you plan to use this feature.

Kevin

koa73

First load from local variable.
Second load (by on button click event) from server by ajax with data parameters

kthorngren

Second load (by on button click event) from server by ajax with data parameters

Probably the easiest way is to use jQuery ajax to fetch the data. You can use clear() to clear the table before the ajax call or use it in the success function. In the success function use rows.add() to populate with the new data.

Kevin

koa73

Ok thx

kthorngren

If I remove ajax data source

Do you mean the ajax.dataSrc option?

put "data": "some variable" I get data, but events catcher don't work at all

What events catcher and how do they not work well. Please provide more specifics like do you get errors, etc.

Maybe instead of "data": "some variable" you need to use ajax.data as a function to allow for different values. See the examples in the docs and this example. You don't need to enable serverSide: true as shown in the example.

The best thing to do is to provide a link to your page or a test case replicating the issue so we can help debug.
https://datatables.net/manual/tech-notes/10#How-to-provide-a-test-case

Kevin

koa73

"What events catcher and how do they not work well. Please provide more specifics like do you get errors, etc."

.on( 'preDraw', function() {sp = {buy:0, sell:0, buyErr:0, sellErr:0};})
.on( 'draw.dt', function() {
$.when(offSpinner()).then(
function(){
gageMaker(sp, "Accuracy");
commonDonut();
initCount('day-', [sp.sell, sp.buy, sp.sellErr, sp.buyErr]);
}
)
They are do nothing If Iset data source like this https://datatables.net/reference/option/data

And they are work if I set options for data source like this https://datatables.net/examples/server_side/custom_vars.html

"Maybe instead of "data": "some variable" you need to use ajax.data" I use this way but I wanna set data source 1 time "data": "some variable" , but on event 'click button' ajax

"The best thing to do is to provide a link to your page or a test case replicating the issue so we can help debug." it's not available at this moment

kthorngren

In general the Datatables initialization options can't be changed. There are some cases like ajax.url() where you can make changes. Datatables isn't built to support both data and ajax at the same time. If you want to load the initial data using data then the use of jQuery ajax will be much easier than trying to manipulate Datatables to go from using data to ajax. See my above comments.

To have the preDraw and draw events called at initialization when using data you will need to initialize the event handlers before initializing Datatables, something like this:
http://live.datatables.net/sowuheha/1/edit

The reason they work when using ajax is Ajax is asynchronous and the event handlers are initialized while waiting for the ajax response.

Kevin

koa73

It's cool. Thx a lot. Everything work ok after changing order of events (set it before table initialize) So now I load data from variable then call load data by ajax on click event.

table_arch.ajax.url( 'rest/data/history/' + d).load();

Set ajax error handler
$.fn.dataTable.ext.errMode = function ( settings, helpPage, message ) {
console.log(message);
};

Everything is ok Thx

kthorngren

But now I can't set only ajax.error handing into init options
Is it the way to set it programmatically

No. This is why I suggested using jQuery ajax.

Kevin

kthorngren

Maybe you can incorporate the use of $.fn.dataTable.ext.errMode and error if you still want to use ajax.url().load().

Kevin