Change background color of last row in a Table.

[ram prasad]

Hi,

 

   I  want to change background color of Last row only in a table. The ColorFormatter- format method  is applied for  column index only. So i tried to cssClassnames.

      In css:

.orange-background {

    background-color: orange;

}

      In javascript:

var cssClassNames = {

'headerRow': 'orange-background large-font bold-font'  //it changes the table header row only,I want to change last row.

};

var options = {'showRowNumber': true, 'allowHtml': true, 'cssClassNames': cssClassNames};

Please help me to resolve this issue.

--
BY

R.RAMPRASAD

[ram prasad]

Anyone please help me...

--
BY

R.RAMPRASAD

[asgallant]

There isn't anything in the API to do this for you, sorry.

You can try to use CSS to make it work, or apply the class manually to the last row of the DataTable.  Note, however, the CSS-based solutions won't work properly with table paging enabled (they will always color the last row drawn on the page, regardless of whether it is the last in the DataTable or not).  Any javascript you write to handle this will have to be aware of any paging you do.

[ram prasad]

I have tried to setRowProperty like below, But it not works,

   function drawVisualization() {
  // Create and populate the data table.
  var data = google.visualization.arrayToDataTable([
    ['Name', 'Height', 'Smokes'],
    ['Tong Ning mu', 174, true],
    ['Huang Ang fa', 523, false],
    ['Teng nu', 86, true]
  ]);
  
  var total=data.getNumberOfRows();
  var lastrow=total-1;
  data.setRowProperty(lastrow, 'border', '1px solid green');

  
  // Create and draw the visualization.
  visualization = new google.visualization.Table(document.getElementById('table'));
  visualization.draw(data, {allowHtml:true});
} 

--
You received this message because you are subscribed to the Google Groups "Google Visualization API" group.
To view this discussion on the web visit https://groups.google.com/d/msg/google-visualization-api/-/ZVaWoFaZcXIJ.
To post to this group, send email to google-visua...@googlegroups.com.
To unsubscribe from this group, send email to google-visualizati...@googlegroups.com.
For more options, visit this group at http://groups.google.com/group/google-visualization-api?hl=en.

--
BY

R.RAMPRASAD

[asgallant]

As I said, there isn't anything in the API that does this.

To post to this group, send email to google-visualization-api@googlegroups.com.
To unsubscribe from this group, send email to google-visualization-api+unsub...@googlegroups.com.

For more options, visit this group at http://groups.google.com/group/google-visualization-api?hl=en.

--
BY

R.RAMPRASAD

[Goce Ribeski]

Looping trough the all cells of the last row will work:

var total_columns =data.getNumberOfColumns();

                  for (var i = 0; i < total_columns; i++) { 

                        data.setProperty(lastrow, i, 'style', 'border: 1px solid green;');

                    }