Redrawing table data and adding in jQuery animations
Redrawing table data and adding in jQuery animations
genghistron
Posts: 5Questions: 0Answers: 0
Let me preface this by saying thanks for this awesome plugin. I’m very impressed with what it can do so far with my limited use.
I’m still new to datatables and I’m running into an issue trying to reload a table back to its original state. Right now I’m having all of the processing done from the client's side and I have the ability to remove rows of data using fnDeleteRow. I also have bStateSave set to true. Is it possible to have a button that will redraw the table back to its original state using client side processing? I can get it to work if I set up bSereside to true but I’d like to keep it off. Here’s my current code for the button:
[code]
$('#refresh_button').click( function () {
oTable.fnClearTable(1);
oTable.fnDraw();
} );
Refresh Table
[/code]
Any idea on what I'm doing wrong here?
Also, I was wondering if it were possible to add in jQeury effects like fadeIn(), fadeout(), slideUp(), etc. when filtering and sorting sets of data. I’m using the ColumnFiterWidget to filter and search for data, so I’m not entirely sure if this would be just updating the javascript there, but ideally I’d like to have something set up similarly to the way this filter works: http://papermashup.com/demos/jquery-list-filter/
If it is possible to do this, is there a breif tutorial on how to do this or are there any examples of where jQuery animations are used when filtering with datatables?
Thanks.
I’m still new to datatables and I’m running into an issue trying to reload a table back to its original state. Right now I’m having all of the processing done from the client's side and I have the ability to remove rows of data using fnDeleteRow. I also have bStateSave set to true. Is it possible to have a button that will redraw the table back to its original state using client side processing? I can get it to work if I set up bSereside to true but I’d like to keep it off. Here’s my current code for the button:
[code]
$('#refresh_button').click( function () {
oTable.fnClearTable(1);
oTable.fnDraw();
} );
Refresh Table
[/code]
Any idea on what I'm doing wrong here?
Also, I was wondering if it were possible to add in jQeury effects like fadeIn(), fadeout(), slideUp(), etc. when filtering and sorting sets of data. I’m using the ColumnFiterWidget to filter and search for data, so I’m not entirely sure if this would be just updating the javascript there, but ideally I’d like to have something set up similarly to the way this filter works: http://papermashup.com/demos/jquery-list-filter/
If it is possible to do this, is there a breif tutorial on how to do this or are there any examples of where jQuery animations are used when filtering with datatables?
Thanks.
This discussion has been closed.
Replies
The fnDestroy API method will help here. You can destroy the table and that will restore the original HTML table, then if you wish you can reinitialise it as a DataTable. The shortcut for that is to use the bDestroy parameter. What's the use case for this - are you updating the table?
> Also, I was wondering if it were possible to add in jQeury effects like fadeIn(), fadeout(), slideUp()
You mean to animate the rows being added and removed? Currently this isn't possible because DataTables will simply remove the TR nodes from the document, thus they "pop" out of existence instantly. Animating row height in tables is notoriously difficult, but I'm sure it would be possible to do what you want with a few hacks in the DataTables core - but it isn't currently possible externally, nor is it built in.
Allan