responsive-tables icon indicating copy to clipboard operation
responsive-tables copied to clipboard

Break for AJAX Load

Open randallmeeker opened this issue 12 years ago • 7 comments

When a responsive table is loaded via an AJAX request it fails to display correctly. I attempt to call 'updateTables' after ajaxComplete, but this does not seem to work either.

randallmeeker avatar Oct 11 '12 16:10 randallmeeker

+1 does not work with yepnope.js

ghost avatar Nov 16 '12 07:11 ghost

If you are talking about the content not being in the "scrollable container" after an ajax call, try calling this when updating content in your ajax implementation, worked for me.

$("table.responsive").each(function(i, element) { splitTable($(element)); });

You may have to make the plugin code and ajax code available to eachother

thm-design avatar Nov 26 '12 10:11 thm-design

I did this:

window.redrawTables = function(){
    $("table.responsive").each(function(i, element) { unsplitTable($(element)); });
    $("table.responsive").each(function(i, element) { splitTable($(element)); });
};

Then I can call redrawTables anywhere. A bit ugly bit it works. Really the best solution would be to make this a proper jQuery plugin so that something like:

$('table.responsive').redrawTable()

Or something simliar

edbo avatar Nov 12 '13 03:11 edbo

There's currently support for updating the pinned table by calling (the vaguely named) $(window).trigger('redraw'), but it doesn't cleanup the existing pinned tables first.

gabetax avatar Jan 30 '14 22:01 gabetax

Just came across this issue now. Rather than messing about with running the responsive table functions again (I can't as the plugin is minified using Gulp and Uglify and so don't have access to the functions), it's easier to simply empty the container for the table using:

$('#container').empty();

Before replacing it with your new data. This fixed most issues for me.

garethdaine avatar Apr 14 '15 11:04 garethdaine

Just fixed the problem by clearing my parent container and calling redraw function after AJAX load. Step 1 : $('#container').empty(); Step 2 : Get the data from Ajax call Step 3 : Bind parent container with the data and table. step 4 : $(window).trigger('redraw'); Step 5 : Done

kuldeepghildiyal avatar Jan 27 '16 16:01 kuldeepghildiyal

kuldeepghildiyal i have run also to the same problem by using a short plugin that i found here https://github.com/danhauk/dm-responsive-tables , could you provide please the code you used so i could fix this? Thank you

honoluluman2 avatar Mar 28 '18 17:03 honoluluman2