Hi,

You will need to set the columns' DataFormat property so that it instead of talking the number as is, it generates a small HTML segment to fill the Grid cell. For example, assuming that your database has red value in hex format, you can set the column's DataFormat to something like this:



This way if your database has value "ff", then the final HTML that is used to fill the grid cell will be



Which will renders as a 10 by 10 red block. Note that it replaces {0} with your data. Obviously without DataFormat, it will render it directly as "ff".

Note you can only use one value with DataFormat and in order to use it as color, it must be hex format. So if you need to take all three colors, the value you pass to the Grid must be a 6 digits hex number. For example, FFFF00 for yellow. This means if the value is stored differently, you will need to format it into a 6 digits string. You can perform such conversion at:

1. In your SQL. For example, you can create a user function to perform such conversion and then call this function in your SELECT statement. I am not sure whether your database server has such function built-in. I do not think SQL Server has it. So if you use SQL Server, you will need to create one. There are such code online though;

2. Perform the conversion on your data source object with C#/VB code --- to load the data from your database to an ADO.NET object such as DataTable, then modify that DataTable and format the color field, then pass the DataTable object to the Grid;

3. Perform the conversion on the Grid. You can populate whatever in your database into the Grid first, then loop through all grid items and modify the color cell's Value property;

Obviously if you already store the color hex code in your database, then no conversion is needed at all.

Thanks!

You

Hi,

Yes. The key is that the Grid takes whatever value in your database, then call string.Format with the DataFormat you provided to format it. It then displays the formatted result. Here is another example of a typical usage of DataFormat: Assuming that you have image Urls (for example, "/images/abc.gif") in your database and you want to display the actual image in the Grid. If you do not set DataFormat, you will see the image Url in your Grid (for example, literally "/images/abc.gif"). However you can set DataFormat to something like this to display the actual image:



It will be easier for you to see how it works if you try the feature out with a static Grid. DataFormat works the same way regardless whether the column is dynamically created or not.

Thanks!

Hi,

Yes. You can use it for any purpose that can be achieved with simple HTML. It won't be a good solution for you to align text though --- the HTML element you put in (in your case the div) won't resize dynamically along with the column. So if you want to align to the right and also allow column resizing. You got to use something else ---- usually by including "text-align:right" on the CellStyle property for that column. For example:



Thanks