I referred few answer from this forum http://www.jqwidgets.com/jquery-widgets-documentation/documentation/jqxgrid/jquery-grid-cellsrendering.htm http://www.jqwidgets.com/community/topic/change-row-color-of-gridview/
Both are done using the cellrendered event of a cell and it can be applied to same cell. How do I get the value of one cell to change the colour of a different cell?
Or is there a method to change the background colour of the entire row? Below is the code I'm using to change the colour of same cell.
var cellsrenderer = function(row, column, value, defaultHtml) {
var element = $(defaultHtml);
element.css({ 'background-color': '#' + value });
return element[0].outerHTML;
return defaultHtml;
$("#jqxgrid").jqxGrid({
width: 1100,
autorowheight: true,
autoheight: true,
source: dataAdapter,
theme: 'classic',
columns: [
{ text: 'Job Number', dataField: 'jobNum' },
{ text: 'Project Name', dataField: 'ProjName' },
{ text: 'Hours', dataField: 'hrssum' },
{ text: 'Project Type', dataField: 'Suffix' },
{ text: 'color name', dataField: 'colorname', cellsrenderer: cellsrenderer }
]
});
}
There are 2 more parameters in the cellsrenderer that are passed by the jQWidgets Grid.
var cellsrenderer = function(row, column, value, defaultHtml, columnSettings, rowData) {
}
The last parameter - rowData is a JSON object which contains the rendered row values. So if you have a column with datafield = firstname, you can write:
var firstName = rowData.firstname;
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With