Can I use the same datatable for client side and server side?

Januraj

I have a dropdown which has 2 values- Yes and No, on clicking "Yes" I have to populate the data which is already there on client side.
On clicking "NO" i need to make call and make datatable as server side

colin

You can use the same table in the DOM. You would just need to initialise it differently, so the server-side has the ajax initialisation.

Colin

Januraj

I am providing a test case
http://live.datatables.net/wilavabi/4/edit
i am having server side table
Here there is a button , on clicking the button i want to show the selected rows in the client side table.
Please help me in solving this

kthorngren

This code, in your button click event, is trying ti initialize Datatables causing the error:

 //i want to show the records on client side datatable
  $('#example').DataTable( {
    "serverSide": false
  });

This example shows how to get the selected rows. Here is the updated example getting the select row data:
http://live.datatables.net/wilavabi/5/edit

i want to show the records on client side datatable

Where/how do you want to display them?

Kevin

Januraj

i want to show the records on client side datatable----
@kthorngren I wanted to use the same table DOM.
the same table should behave as client side table with only selected rows on clicking the button

Januraj

@kthorngren please help me in resolving this issue

colin

I'm not following the problem, sorry. In your test case, are you saying you only want to show the selected items? And all other records are removed from the table? Do you also need serverSide - are you expecting to have more that 10-20k records?

Colin

Januraj

Yes , we want the same datatable to behave as server side and client side based on the button.

On clicking the button i want to display the selected records in the same table and the table should behave client side

kthorngren

There are a few ways I can think of to do this. I would probably create two tables, hiding the second one. Use the techniques shown above to get the selected rows then use rows.add() to populate the second table.

Kevin

Januraj

Okay . The solution would be to have 2datatables and toggle them based on selection.
With one datatable it is not achievable is it?

kthorngren

With one datatable it is not achievable is it?

You could use destroy() and destroy the server side Datatable, reinitialize the client side Datatable and add the selected rows.

Kevin