[Q] Dojo(x) Widgets within HTML table do not resize

Question

I have the following page using Dojo 1.3.1 javascript toolkit

Content Pane
  HTML table   two columns, N rows
  Column 1 (left):   text
  Column 2 (right)   Dojo widget (can be any, but mostly Grids, pullodwn, etc)

Problem: When page loads, it renders Ok (the type of widget and the number per page are determined at runtime, so I cannot manage this with static CSS)

WHen I add rows to the grid, while it is embedded in the Table cell

<td> grid </td>

the the given row (where the grid is embedded) gets proportionally taller and everything below the grid disappears and there is no scroll bars on the Content Pane to get to the the rows below.

I do not know how to solve it, I have set 100% or auto height and width on everything around the page. THat does not help.

I am wondering if my design approach is wrong and it is unsolveable. I have read about people telling not to use Tables for layout, but I do not know at design time the order and the type of controls that I will be displaying. How else can this be done?

I think the problem is that when a grid is within a Table cell, and the grid expands, the cell expands, but the holding content pane is not aware it so borders do not get redrawn.

thank you in advance for any suggestions.

Answer 1

You could use CSS for layout -- what is it that tables can do and CSS don't? Or, you could try using another dojo grid instead of that HTML table, depending on what you're after.

Answer 2

Dijit's widgets work like normal nodes as much as possible. But many widgets, especially ones that let the user define what size things are (as you can with column widths in the grid) need to know specific dimensions.

The good news is that with most of these widgets, you can get an instance of the widget, and call widget.resize();