reload the ajax data, every time click the button

chiro

Hi.

I want to reload the Ajax data, every time click the "reload" button.
Like this. (used destroy: true)

According to here

Note that if you are not changing the configuration of the table, but just altering the data displayed by the table, it is far more efficient to use theajax.reload()method (or rows.add()etc).

So I want to use ajax.relaod(). However, I get an error.
How should I use it? Thanks :-)

colin

You missed out the DataTable() part, i.e.

  $('#table').DataTable().ajax.reload();

Colin

chiro

my mistake
I tried that, but I still get the error.

Cannot reinitialise DataTable. For more information about this error, please see http://datatables.net/tn/3

Is there any other way?

colin

It's working for me here: https://jsfiddle.net/tLgo9d0b/

Colin

chiro

When I click it a second time, I get an error.
I want to reload the ajax data, whenever button click!

kthorngren

Did you follow the troubleshooting steps listed at the link in the error?
http://datatables.net/tn/3

You are reinitializing Datatables. If you aren't changing the Datatables config options you don't need to reinitialize. Move the initialization outside of the click event, like this:
https://jsfiddle.net/h3ovjeq5/

Kevin

chiro

That's not the problem I'm looking for.

I modified the example in detail, can you check it?

1. Enter your name.
   One of Tiger, Garrett, Ashton, Cedric

2. Click the button.

3. Modal is opened and the data searched by name is displayed.

Close the modal and click the button again, I want to reload the ajax.
How do I reinitializing Datatables?

Thanks.

kthorngren

Did you look at the options listed in the technote?
http://datatables.net/tn/3

You can use the retrieve option like this:
https://jsfiddle.net/ujox8hg4/

You can destroy and reinitialize Datatables using the destroy option, like this:
https://jsfiddle.net/ujox8hg4/

You can init Datatables initially then just use ajax.reload(), like this:
https://jsfiddle.net/vtjqurng/

You can add the use of $.fn.dataTable.isDataTable() in the getUser() function. If its false then initialize Datatables. If its true then just use ajax.reload(). Like this:
https://jsfiddle.net/9ra8ugbq/

Kevin

kthorngren

Actually for your case retrieve won't work as it only retrieves the API object and won't use ajax.

Kevin

chiro

I've tried the example, but there are some problems.

1. retrieve : my case won't work.
2. destroy : This is as perfect as I think, but it's less efficient than ajax.reload().
3. ajax.reload() : I tried with your example, the first time ajax is loaded twice.
4. $.fn.dataTable.isDataTable() : That's the answer I was looking for! I modified it referring to your last example.

Like this. This works perfectly like I think.

Thanks for replying! :-)