.Hey guys
I have 4 grids on a pay that are located inside bootstrap divs.
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 |
<div class ="row"> <div class="col-sm-4"> <div id="Grid1Placeholder" > <table id="Grid1_grid"></table> <div id="Grid1_gridPager"></div> </div> </div> <div class="col-sm-4"> <div id="Grid2Placeholder" > <table id="Grid2_grid"></table> <div id="Grid2_gridPager"></div> </div> </div> </div> <div class ="row"> <div class="col-sm-4"> <div id="Grid3Placeholder" > <table id="Grid3_grid"></table> <div id="Grid3_gridPager"></div> </div> </div> <div class="col-sm-4"> <div id="Grid4Placeholder" > <table id="Grid4_grid"></table> <div id="Grid4_gridPager"></div> </div> </div> </div> |
My change width on resize works fine.
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 |
$(window).bind('resize', function() { $('#Grid4').setGridWidth(200, true); $('#Grid4').setGridWidth($('#Grid4Placeholder').width(), true); $('#Grid3').setGridWidth(200, true); $('#Grid3').setGridWidth($('#Grid3Placeholder').width(), true); $('#Grid2').setGridWidth(200, true); $('#Grid2').setGridWidth($('#Grid2Placeholder').width(), true); $('#Grid1').setGridWidth(200, true); $('#Grid1').setGridWidth($('#Grid1Placeholder').width(), true); }).trigger('resize'); |
the resize on window resize works fine.
However i need to set the width on creation of the grid.
I have tried
1) an onload event – No difference in size
2) autowidth: true – no change
3) shrinkToFit: true – no change (i think this is a default anyway)
4) width: null – this works. the grid takes up the full bootstrap div size but the columns are all wrong.
5) i have tried using the onLoadComplete event no good ether.
6) a number of fixes off SO that seem to work on paper but dont.
As i said the resize function works fine. All i can think of is that when the page load fires the grids have not finished their setup yet.
any help would be great
Copyright 2014 TriRand LtdAll Rights ReservedRSS
Back to Top
