:: Forum >> Version 1 >>

Freeze column one can't wrap header (corner) text

I followed the instructions in /javascript.forum.1393.4/ to freeze the first column. However my default column height is 40px, that is allowing 2 lines of text wrapping in each column header. However, the wrapping for the header of the first column is not working.

Finally I find this is related to the css. What is the correct css for the corner?
.active-scroll-top .active-box-image {height1em}
 
<style>
.
active-controls-grid font-size=11height100%; fontmenu; }
.
active-grid-column font-family=Arialfont-size=11border-right1px solid threedlightshadow; }
.
active-grid-row font-family=Arialfont-size=11height17pxbackgroundwhiteborder-bottom1px solid threedlightshadowborder-right1px solid threedlightshadow; }
.
active-grid-row .active-list-item, .active-scroll-left .active-list-item {height17px;} 
.
active-scroll-top .active-box-image {height1em}
</
style>

<
script>
    var 
myData = [
        [
"MSFT","<font color=red>Microsoft Corporation</font>""314,571.156""32,187.000""55000"],
        [
"ORCL""Oracle Corporation""62,615.266""9,519.000""40650%"],
        [
"SAP""SAP AG (ADR)""40,986.328""8,296.420""28961"],
        [
"CA""Computer Associates Inter""15,606.335""3,164.000""-16000"],
        [
"ERTS""<a href=http://www.yahoo.com>Electronic Arts Inc.</a>""14,490.895""2,503.727""4000"],
        [
"SFTBF""Softbank Corp. (ADR)""14,485.840"".000""6865"],
        [
"VRTS""Veritas Software Corp.""14,444.272""1,578.658""5647"],
        [
"SYMC""Symantec Corporation""9,932.483""1,482.029""4300"],
        [
"INFY""Infosys Technologies Ltd.""9,763.851""830.748""a"],
        [
"INTU""Intuit Inc.""9,702.477""1,650.743""3647"],
        [
"ADBE""Adobe Systems Incorporate""9,533.050""1,230.817""3341"],
        [
"PSFT""PeopleSoft, Inc.""8,246.467""-""8180"],
        [
"SEBL""Siebel Systems, Inc.""5,434.649""1,417.952""5909"],
        [
"BEAS""BEA Systems, Inc.""5,111.813""965.694""3063"],
        [
"SNPS""""4,482.535""1,169.786""4254"],
        [
"CHKP""Check Point Software Tech""4,396.853""424.769""1203"],
        [
"MERQ""Mercury Interactive Corp.""4,325.488""444.063""1822"],
        [
"DOX""Amdocs Limited""4,288.017""1,427.088""9400"],
        [
"CTXS""Citrix Systems, Inc.""3,946.485""554.222""1670"],
        [
"KNM""Konami Corporation (ADR)""3,710.784"".000""4313"]
    ];

    var 
myColumns = [
        
"Ticker<br>Ticker""Company<br>Name""Market Cap.""$ Sales""Employees"
    
];
    
</
script>

<
body>
<
a href=http://www.yahoo.com>Electronic Arts Inc.</a>
<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);

//    set headers width/height
obj.setRowHeaderWidth("80px");
obj.setColumnHeaderHeight("34px");

//    replace row header text with first data column
obj.setRowProperty("text", function(i){return this.getDataProperty("text"i0)});
//    set indices of other columns (hide column 0)
obj.setColumnProperty("values", [1,2,3,4]);

//    define template for the first column header
obj.defineTemplate("corner", new Active.Templates.Header);
//    assign this template as the content of top left corner
obj.getLayoutTemplate().setContent("corner", function(){return this.getCornerTemplate(0)});

//    adjust header template
var corner obj.getCornerTemplate();
//    redirect item property requests to column property
corner.getItemProperty = function(name){return this.getColumnProperty(name0)};
//    disable resizing
corner.getContent("div").setEvent("onmousedown"null);
corner.getContent("div").setStyle("cursor""default");
// set width and height
corner.setStyle("width""80px");
corner.setStyle("height""34px");
corner.setClass("column""0");

//    provide cells and headers text
obj.setDataProperty("text", function(ij){return myData[i][j]});
obj.setColumnProperty("text", function(i){return myColumns[i]});

obj.setDataProperty("value", function(i,j){ 
    var 
text "" this.getDataText(ij); 
    if (
text.match(/^\s*$/)) {return ""
    var 
value Number(text.replace(/[ ,%\$]/gi"").replace(/\((.*)\)/, "-$1")); 
    return 
isNaN(value-999999999 value
}); 

//    assign row selection event to left/item (cell)
var cell = new Active.Templates.Text;
cell.setClass("grid""row");
cell.setClass("row""cell");
cell.setClass("column""0");
obj.setTemplate("left/item"cell);

//    write grid html to the page
document.write(obj);
</
script>

</
body>
 
Henry Ng
Saturday, November 6, 2004
I figured out to add this in the css and seems working.... any better way in doing this?

.active-box-image {height1em}
 
Henry Ng
Saturday, November 6, 2004



This topic is archived.

Back to support forum

Forum search