To create a support ticket, start a search

Products Grid: modifying colors dynamically

To customize your grids, you can apply a color code on various cells according to their values.

  • In the Grids Editor Advanced section, select Products Grids in the left handside.
  • Select the corresponding field, or create a virtual field if it does not exist (in the database):

ID: testColor
Table: none
Name: testColor
Type: Display only

 

  • Then in the right handside, select 'JS afterGetRows', and enter:

echo "
idxCustomColumn=cat_grid.getColIndexById('quantity');
cat_grid.forEachRow(function(rid){
if (cat_grid.cells(rid,idxCustomColumn).getValue() <= 0){
cat_grid.cells(rid,idxCustomColumn).setBgColor('#FF0000');
cat_grid.cells(rid,idxCustomColumn).setTextColor('#FFFFFF');
}
});
";

 

The above code adds a red color to the 'quantity' column when the value is <= 0.


Notes

  • The color applied by the code has priority over the color you may set in the Grids Editor configuration panel.
  • The code will be applied on all products grids.