ActiveWidgets • Grid and float left problem

If I try and put a grid in a 2 column div layout, in firefox I loose the scroll bars and in IE the columns widths for each row get all out of wack.

Here are two links that demonstrate the prob. The first is with it working ok. The second is with it problem mentioned above.

http://www.copperleaf.org/dhtmltest/grid/
http://www.copperleaf.org/dhtmltest/combo/

When you start a DIV, then try and to JavaScript in the middle of it, things get out of whack. Or at best are not predictable. I suggest that you create the DIV's and set all their properties, including ID's. Then after the divs have closed, do the JavaScript and place the output into the div. So your code will look like this:

<body>  

    <div id="mywidget">

      <div id="mytree">

      </div>

      <div id="mylist">

      </div>

    </div>

          <script>

      

          //    create ActiveWidgets Grid javascript object

          var obj = new Active.Controls.Grid;

      

          //    set number of rows/columns

          obj.setRowProperty("count", 20);

          obj.setColumnProperty("count", 5);

      

          //    provide cells and headers text

          obj.setDataProperty("text", function(i, j){return myData[i][j]});

          obj.setColumnProperty("text", function(i){return myColumns[i]});

      

          //    set headers width/height

          //obj.setRowHeaderWidth("28px");

          obj.setColumnHeaderHeight("20px");

      

          //    set click action handler

          obj.setAction("click", function(src){window.status = src.getItemProperty("text")});

      

          //    write grid html to the page

          document.getElementById("mylist").innerHTML = obj;

      

          </script>



  </body>

don't know if this will solve your problem but it might help.

Floating divs will make your your page looks like a pinball game in firefox. The rendering in Firefox is done on many ocasions and this is visilble for the user. It looks like all element are starting at the top and moved to their final position (looks like flashing).

I tried adding the the table after the closing body tag as described above. Same result. I'm going to give using a table a try.

I've gone back and tried putting it in a table layout and I get the same result.

Here is a link to the table version

http://www.copperleaf.org/dhtmltest/combo/tableversion.html

Bill,

grid does not work in your examples because you are using strict DOCTYPE. The current version works in quirks more only (version 2.0 will support strict).

Thanks Alex. That fixed it.

Grid and float left problem

Documentation:

Forum search