Tabulator on Bootstrap tab

As i was going on my project WorkNxt, i found a new interesting problem.

i mean this one of the main reasons i started this anyway, is to find and solve interesting problems! 

i am using Tabulator and Bootstrap along with other JS and CSS libraries on this project, and what i wanted was very simple, to have a bootstrap tab navigator with two tabs each with a Tabulator table on it.

Simple?, not really, see what i found out is for some reason Tabulator might have trouble rendering in a Div with css display set to none, which is exactly the not shown yet tab(s) would be.

How did i resolve this, and i would dare to say it's a very good solution, is the little JS script below


 function redrawTable() {
 	tabulatorTable.redraw();
 	$('#detials-tab a[href="#TargetTab"]').unbind('shown.bs.tab', redrawTable);
 }

 $('#detials-tab a[href="#TargetTab"]').on('shown.bs.tab', redrawTable);

Popular posts from this blog

add extra files on deploy ASP Core web app using publish profile

how to copy NuGet packages from one project to another

Blazor how to generate that SHA256 check