ActiveWidgets • How to format each cell?

Hi!

I will list my purpose as the following:
- I take the data from database to display on the browser
- All taken data are ranged into row and column as grid
- Then, in each cell of grid, I need to format data's displaying in different ways. For example :
first row and first column : display data on the left
second row and first column : display data on center
third row and first column : display data on right
............. so on.

Anyone know how to do so?

Best,
Finan

#myGrid .aw-column-0 {text-align: left;}

#myGrid .aw-column-0 {text-align: center;}

#myGrid .aw-column-0 {text-align: right;}

I think that will do what you want assuming you setId("myGrid").

Could you give me an example how to use that? Because when i tried your formule, it's still the same (Doesn't work).

Best,
Finan

<html>

<head>

  <link href="/runtime/styles/aqua/aw.css" rel="stylesheet"></link>

  <script src="/runtime/lib/aw.js"></script>



  <style>

    .aw-column-0 {text-align: left;}

    .aw-column-1 {text-align: center;}

    .aw-column-2 {text-align: right;} 

  </style>



  <script>

    var myData = [

      ["MSFT","Microsoft Corporation", "314,571.156"],

      ["ORCL", "Oracle Corporation", "62,615.266"],

      ["SAP", "SAP AG (ADR)", "40,986.328"],

      ["CA", "Computer Associates Inter", "15,606.335"],

      ["ERTS", "Electronic Arts Inc.", "14,490.895"],  

    ];



    var myColumns = [ "Ticker", "Company Name", "Market Cap." ];

  </script>

</head>

<body>

  <script>

    var obj = new AW.UI.Grid;

    obj.setCellText(myData);

    obj.setHeaderText(myColumns)

    obj.setRowCount(5);

    obj.setColumnCount(3);

    document.write(obj);

  </script>

</body>

</html>

For single-cell (same column) formating you need to override the css-column-style by js like: (just add this block after document.write(obj) )

for(var x=0;x<myData.length;x++){  

if(obj.getCellText(0,x)%2){ 

obj.getCellTemplate(1,x).setStyle('text-align', 'right');

 }

 }

But sometimes need to apply the new style (i.e. background) to the inner (box/text) element .
obj.getCellTemplate(col,row).getContent('box/text).setStyle('background', 'yellow');
HTH

Uppss , forget the last one (no box/text)

Sorry again (my samples have a numeic value in zero column)
To make it compatible with standard AW (or above) samples Please replace:

if(obj.getCellText(0,x)%2){
with:
if(x%2){
Thanks

Yes it works right now . Thank a million my friends....

Regards,
Finan

Hi everybody,

I have one more problem. It is about:

- obj.getCellText(i,j) : it works only with Mozilla but
- which instruction we should use with IE (internet explorer) ?

How to format each cell?

Forum search