Recall ajax load data and error manage

lucacali87

Hi, I'm using two datatables, from the first table the user can select one row and with next button he can see the second table.
The data of second table depends on the selected row in the first table, but I have some problem with recall second table if the user gooes back and retry. I receive error on reinitialise and the page shows the old second table.
How can I repopulate the second table?
If I would to manage ajax error, how can I do?
Thanks

$(function() { $("#next").click( function() { $('#carsSelectionTable').DataTable( { "ajax": "cars/"+$("#selectedFleet").val(), "columns": [ { "data": "id" }, { "data": "initialKm" }, { "data": "carChassis" }, { "data": "note" } ] }); }); });

I really need save the selected row also for the second table, so I have to define if before ajax call,then how can I call rest webservices?

jLinux

So let me get this straight...

You're saying that when you click a row in the 1st table (which will determine the AJAX Url of the 2nd table), then click next to generate the 2nd table, then go back and try again with a different row, you get an error?

What you should do when the 2nd table is loaded, is either..

1. Use the destroy to destroy the table before it attempts to get re-created - This isnt recommended, unless the data-structure between all of the possible ajax URL's have a different structure, meaning the columns are different.
2. Check if the table was created already, if so, use ajax.url(), if not, then create it.

If thats not right, can you atleast link to the error that you said it shows? that would be helpful.. As well as a link to the page itself if you can

lucacali87

yes, I get error when I go back and try with different row. Tha table is the same for all the ajax call, only the fields change. How can I follow the second advice?

jLinux

Only the fields change? You mean the columns? or the cell values? Thats a very important difference...

If they don't change, then you can just use the $.fn.dataTable.isDataTable() to check if its a DT instance, and ajax.url().load() to load a new url..

Heres a quick example, you can see on the first button click, it generates the table, on the 2nd, it checks if its a DT instance, if so, changes the URL

lucacali87

Only the cell values. I updated my code so:
if ( ! $.fn.DataTable.isDataTable( '#carsSelectionTable' ) ) { carTable = $('#carsSelectionTable').DataTable({ select: { style: 'single' }, "ajax": "cars/"+$("#selectedFleet").val(), "columns": [ { "data": "idCar" }, // { "data": "acquisitions.0" }, { "data": "id" }, { "data": "carChassis" }, { "data": "initialKm" }, { "data": "note" } ] }); } else { carTable.ajax.url("cars/"+$("#selectedFleet").val()).load(); } carTable .on( 'select', function ( e, dt, type, indexes ) { var rowData = carTable.rows( indexes ).data().toArray(); //selectedFleet= rowData[0][0]; $("#selectedCar").val(rowData[0].idCar); $("#next").show(); } );
but when the code calls carTable.ajax.url..... I retrieve Uncaught TypeError: api.rows(...).ids is not a function. I read that it is possible an error for an old version, I tried but it still presents the same error
EDIT: after some restart it seems to work

jLinux

Really need to format that code for me to read it... Read the instructions below the input box...

To highlight code snippets, use ````` before and after the code on newlines.