can someone tell me what I'm doing wrong here?
Style:
<style>
.active-controls-grid {width: 230px; height: 360px; font: menu; overflow: hidden;}
.active-column-0 {width: 1px; background-color:#FFFFFF; visibility:hidden; display: none!important;}
.active-column-1 {width: 90px; }
.active-column-2 {width: 130px; }
.active-grid-column {border-right: 1px solid threedlightshadow;}
.active-grid-row {border-bottom: 1px solid threedlightshadow;}
.active-templates-row.gecko { display: -moz-box; width: auto; min-width: 100%; }
.active-row-highlight {background-color: #ddeeff!important}
.active-row-highlight .active-row-cell {background-color: #ddeeff;}
</style>
html:
[code <td align="left">
<div id="stuff">
<div id="loading" style="margin: 10px; color: #979797">Loading...</div>
</div>
</td>][/code]
js:
var table = new Active.XML.Table;
table.setURL(get_xml_url("list"));
table.request();
var columns = ["id", "head1", "head2"];
// create ActiveWidgets Grid javascript object
var obj = new Active.Controls.Grid;
obj.setColumnProperty("texts", columns);
obj.setDataModel(table);
var alternate = function(){
return this.getProperty("row/order") % 2 ? "#fcfaf6" : "#ffffff";
}
var mark = function(){
var i = this.getProperty("row/index");
return (i==2 || i==4 || i==5) ? true : false;
}
var row = new Active.Templates.Row;
row.setStyle("background", alternate);
row.setClass("mark", mark);
row.setEvent("onmouseover", "mouseover(this, 'active-row-highlight')");
row.setEvent("onmouseout", "mouseout(this, 'active-row-highlight')");
obj.setTemplate("row", row);
document.getElementById("events").innerHTML = obj;
I get no scroll bars Horizontal or vertical, the columns don't line up properly, the column headers don't show up properly and don't resize.. it's a mess. I've used the widget before with success but I'm not sure what's going on here.
