Problem with image column while re-binding grid.

[Pinaki Basu]

Hi,

I have two columns in my grid for which i add image in CellFormatting event. But when i re-bind my grid, those images come up in all columns.I am not able to trace the issue. I have tried adding GridviewImageColumn as well, but with that also i am facing the same problem. I have attached the screen shot.
My Code:

 DataTable dtTemp = new DataTable();
            for (int i = 0; i < dsTemp.Tables.Count; i++)
            {
                dtTemp.Merge(dsTemp.Tables[i]);
            }
            SetSummaryInFooterForCoaching(dtTemp);            
            CoachingGrd.DataSource = dtTemp.DefaultView;
            //if (CoachingGrd.Columns.Contains("Settings") || CoachingGrd.Columns.Contains("Agents Connected"))
            //{
            //    CoachingGrd.Columns.Remove(CoachingGrd.Columns["Settings"]);
            //    CoachingGrd.Columns.Remove(CoachingGrd.Columns["Agents Connected"]);
            //}
            //AddImageColumn(CoachingGrd.Columns.Count);
            
            (this.CoachingGrd.GridElement as GridTableElement).TableHeaderHeight = 35;
            CoachingGrd.MasterTemplate.AllowEditRow = true;
            CoachingGrd.MasterTemplate.AutoSizeColumnsMode = GridViewAutoSizeColumnsMode.Fill;
            CoachingGrd.AllowColumnReorder = false;
            CoachingGrd.ThemeName = "ControlDefault";
            foreach (GridViewDataColumn column in CoachingGrd.Columns)
            {
                HideCoachingColumns(column);
                column.ReadOnly = true;
                if (column.FieldName == SalesCenterSettingsColumns.Range)
                    column.ReadOnly = false;           
                column.WrapText = true;
                column.TextAlignment = ContentAlignment.MiddleCenter;
            }

private void CoachingGrd_CellFormatting(object sender, CellFormattingEventArgs e)
        {
            GridViewDataColumn column = e.CellElement.ColumnInfo as GridViewDataColumn;

            if (column != null && column.FieldName == "Agents Connected")
            {
                e.CellElement.TextAlignment = ContentAlignment.MiddleLeft;
                e.CellElement.Image = global::PoseidonClient.Properties.Resources.People;
                e.CellElement.ImageAlignment = ContentAlignment.MiddleRight;
            }
            if (column != null && column.FieldName == "Settings")
            {
                e.CellElement.Image = global::PoseidonClient.Properties.Resources.Settings;
            }
        }

Thanks,
Pinaki

[Jack]

Hello Pinaki Basu,

RadGridView uses UI virtualization for its visual elements. That means that they are reused when scrolling or applying some data operation. Find more information about this in this blog article. Because of all this, you should reset all properties set in a previous step when some condition is not applicable. I changed your code accordingly, please consider the following code snippet:

private void CoachingGrd_CellFormatting(object sender, CellFormattingEventArgs e)
{
    GridViewDataColumn column = e.CellElement.ColumnInfo as GridViewDataColumn;

    if (column != null && column.FieldName == "Agents Connected")
    {
        e.CellElement.TextAlignment = ContentAlignment.MiddleLeft;
        e.CellElement.Image = global::PoseidonClient.Properties.Resources.People;
        e.CellElement.ImageAlignment = ContentAlignment.MiddleRight;
    }
    if (column != null && column.FieldName == "Settings")
    {
        e.CellElement.Image = global::PoseidonClient.Properties.Resources.Settings;
    }
    else
    {
        e.CellElement.Image = null;
    }
}

I hope it helps. If you need further assistance, please contact me.

Best wishes, Jack
the Telerik team