[jQuery] Getting width of object when width isn't set
I've got three tables that i generate, and i would like to make the
width's of all the columns the same
Here's a screen shot (sorry about having to blur it out, but the
effect is there) of what i have
http://i36.tinypic.com/291dlkp.jpg
You can see that the first table has skinnier columns than the second
which is skinnier than the third, etc
HTML is like
<table class="R_TBL">
<thead><tr><th>One</th><th>Two</th><th>Two</th></tr></thead>
<tbody>......</tbody>
</table>
<table class="R_TBL">
<thead><tr><th>One</th><th>Two</th><th>Two</th></tr></thead>
<tbody>......</tbody>
</table>
etc etc....
So i thought:
"i'll loop through all the tables' header rows, and save the highest
width value"
function Grid_Colunns_Resize() {
var AllTables = $(".R_TBL");
if (AllTables.length > 1) {
var Widths = [];
var Init = true;
$(".R_TBL").each(function() {
$(this).find(".header").each(function(idx) {
alert($(this).width());
});
return false;
});
}
}
So right now i am just going through the first table's headers and
"alert"-ing the width of each header item (<th>)
Problem is, $(this).width() is always returning 0 as the value...
according to the jQuery docs, this value should
"Get the current computed, pixel, width of the first matched element"
Well, the table headers are generated (same as "computed"?), shouldn't
i get a positive value back for calling .width() ?