Image in cell based on value of another cell.

[Kannan Venkataramani]

Hi,

New to Syncfusion, been using infragistics before, so apologies if this a simple one.

Here is my requirement, I have a trading grid with trades coming in via EMS tibco, the messages will be read on to a dataset and bound to this grid using a dataview.

So i need 3 extra columns (i can create them in the dataset as empty columns may be), on these columns i need to show 3 images on the grid, i also need to change the image for specific rows based on the value in another cell on the same row.

Ex : Row 1 has trade data.
If row 1 column 1 (Quantity) <100, then image 1, else image 2.

How do i achieve this with syncfusion grid?
Was searching in the samples folder and not able to spot one, could you point me to the correct sample or give me some sample code on how to get this done.

Thanks in advance for the help.

[Kannan Venkataramani]

Am using the latest version of Syncfusion 7.4 for Windows forms on .net 2.0

[Lingaraj S]

Hi Kannan,

Thank you for evaluating Syncfusion products.


In GridDataBoundGrid no need to add the column in Data Source, Because our control is supporting the unbound column in Grid as shown below:

// It used clone the Internal column
GridBoundColumnsCollection collection = (GridBoundColumnsCollection)this.gridDataBoundGrid1.Binder.InternalColumns.Clone();
this.gridDataBoundGrid1.GridBoundColumns = collection;
// Below code used to add the unbound column in GridDataBouondGrid
GridBoundColumn unbound;
unbound = new GridBoundColumn();
unbound.MappingName = "Image1";
unbound.HeaderText = "Value1 Image";
collection.Insert(1, unbound);
// Below code used to set the cell type to show the image
this.gridDataBoundGrid1.Binder.InternalColumns["Image1"].StyleInfo.CellType = "Image";
// Below code used to set the cellvalue type like image, int and other valid types
this.gridDataBoundGrid1.Binder.InternalColumns["Image1"].StyleInfo.CellValueType = typeof(Bitmap);

Please try using CellValue method in QueryCellInfo to achieve your requirement as shown below.

this.gridDataBoundGrid1.Model.QueryCellInfo += new GridQueryCellInfoEventHandler(Model_QueryCellInfo);
// This event is used to set the Image column vallue based on another cell
void Model_QueryCellInfo(object sender, GridQueryCellInfoEventArgs e)
{
// To set the Image value after the header column
if (e.RowIndex > this.gridDataBoundGrid1.Model.Rows.HeaderCount)
{
// The NameToColIndex method is used to find the column
int image1 = this.gridDataBoundGrid1.Binder.NameToColIndex("Image1");
int value1 = this.gridDataBoundGrid1.Binder.NameToColIndex("Value1");
if (e.ColIndex == image1)
{
// The cellvalue property is used to retrive the cell value, based in index
int val =(int) this.gridDataBoundGrid1.Model[e.RowIndex, value1].CellValue;
// Contditional statements used to show the images in Image column based on another column value
if (val > 100)
{
e.Style.CellValue = picture[0];
}
else
{
e.Style.CellValue = picture[1];                    
}
}
}
}


Refer the sample form below link(VB code is attached in below link):
http://files.syncfusion.com/support/samples/grid.windows/forums/GDBGDemo/main.htm

Please let me know if you have any queries.

Regards,
Lingaraj S.
            

[Kannan Venkataramani]

Fantastic Lingaraj, worked a treat, Thanks for the heads up.

Another question on the same, is there a way to set a default image to a column?

I tried this, but the column shows up blank without the image.


dgData.Binder.InternalColumns["Approve"].StyleInfo.CellType = "Image";
dgData.Binder.InternalColumns["Approve"].StyleInfo.CellValueType = typeof( Bitmap );
dgData.Binder.InternalColumns["Approve"].StyleInfo.CellValue = "my bitmap image object";

[Kannan Venkataramani]

also is there a way to set the image on the header too?

[Lingaraj S]

Hi Kannan,

Thank you for the update.

The unbound columns are not stored the value into GridDataBoundGrid, So if you need to set the default value to unbound column, it can be achieved only through handling QueryCellStyle event with conditional statements as shown below:

void Model_QueryCellInfo(object sender, GridQueryCellInfoEventArgs e)
{
int image1 = this.gridDataBoundGrid1.Binder.NameToColIndex("Image1");
int value1 = this.gridDataBoundGrid1.Binder.NameToColIndex("Value1");
if(e.RowIndex==0&&e.ColIndex == image1)
{
// It is used to set the image for Header
e.Style.CellType="Image";
e.Style.CellType=typrof(BitMap);
e.Style.CellValue=set your picture here
}
else
{
if (e.ColIndex == image1)
{
int val =(int) this.gridDataBoundGrid1.Model[e.RowIndex, value1].CellValue;
// Please try using your conditional statements based on your requirement to set the default image
if (val > 100)
e.Style.CellValue = picture[0];
else if(val>0)
e.Style.CellValue = picture[1]; 
else
e.Style.CellValue = defalutpicture;
}
}
}

Please let me know if it helps.

Regards,
Lingaraj S.

[Kannan Venkataramani]

Thanks again for the reply, as the grid will be processing lots of messages, wanted to make it as fast as possible, so removing the extra handler will help if it can,

Can a dataset of type bitmap be used to show the picture in the grid column instead of the unbound column, as am already processing rows in the dataset, it would make sense to have a bitmap column and set it during that stage itself instead of doing it on the Grid.

Header image is not that big an issue, if i can get rid of the Querycell handler and bind the bitmap type dataset column.

I tired binding a bitmap type column, and show up blank, should i set the celltype to something else?

[Lingaraj S]

Hi Kannan,

Thank you for the update.

If you want to show the image in Bitmap column, please try using Image cell type in Bitmap column as shown below:

>>C#<<
gridDataBoundGrid1.Binder.InternalColumns[bitmapcolumnname].StyleInfo.CellType = "Image";
>>VB<<
gridDataBoundGrid1.Binder.InternalColumns(bitmapcolumnname).StyleInfo.CellType = "Image"

Refer the modified sample from below link:
http://files.syncfusion.com/support/samples/grid.windows/forums/GDBGDemo/GDBGTableDemo.zip

Please let me know if it helps.

Regards,
Lingaraj S.

[Kannan Venkataramani]

A huge thanks again Lingaraj, everything works perfect as expected.

[Lingaraj S]

Hi Kannan,

Thanks for the update and using Sycnfusion products.

Please let me know if it helps.

Regards,
Lingaraj S.