How to change image from a GridImageColumn on click event

[Leopoldo C.]

How can I change a image of CellGrid when click event occurs?

Example:

grid.CellClick += Grid_CellClick;
private void Grid_CellClick(object sender, Syncfusion.WinForms.DataGrid.Events.CellClickEventArgs e)
{
  var obj = e.DataRow.RowData as DGVClass;
  if (obj.Play == StatusPlayer.Stop) //Not playing
  {
    PlayFile(obj); // Play obj.File and set obj.Play = StatusPlayer.Playing
    (sender as XXX).Image = Properties.Resources.Stop; // <= How do this?
  }
  else if (obj.Play == StatusPlayer.Playing)
  {
    StopFile(obj); // Stop obj.File and set obj.Play = StatusPlayer.Stop 
    (sender as XXX).Image = Properties.Resources.Play; // <= How do this?
  }
​//another elses
​}

[Vijayarasan Sivanandham]

Hi Leopoldo C,

Your requirement to change the Image when a cell clicks in SfDataGrid can be achieved by loading the image based on cell value using the SfDataGrid.QueryImageCellStyle event and change the cell value in the CellClick event to change the image. Please refer to the below code snippet,

//Event subscription

 sfDataGrid.QueryImageCellStyle += OnQueryImageCellStyle;

 

//Event Customization

 private void OnQueryImageCellStyle(object sender, QueryImageCellStyleEventArgs e)

 {

     var employee = (Employee)e.Record;

 

     if (e.Column.MappingName == "Trustworthiness")

     {

         if (employee.Trustworthiness.ToString() == "Sufficient")

         {

             //Here add the image to display based on the custom condition

             e.Image = (Image.FromFile(@"..\..\Images\Sufficient.png"));

             e.DisplayText = string.Empty;

         }

         else if (employee.Trustworthiness.ToString() == "Insufficient")

         {

             //Here add the image to display based on the custom condition

             e.Image = (Image.FromFile(@"..\..\Images\Insufficient.png"));

             e.DisplayText = string.Empty;

         }

         else if (employee.Trustworthiness.ToString() == "Perfect")

         {

             //Here add the image to display based on the custom condition

             e.Image = (Image.FromFile(@"..\..\Images\Perfect.png"));

             e.DisplayText = string.Empty;

         }

     }

     else if (e.Column.MappingName == "EmployeeName")

     {

 

         e.Image = employee.Gender == "1" ? (Image.FromFile(@"..\..\Images\Male.png")) : (Image.FromFile(@"..\..\Images\Female.png"));

         //here display the image with text

         e.DisplayText = (e.Record as Employee).EmployeeName.ToString();

         e.TextImageRelation = TextImageRelation.ImageBeforeText;

     }

     else

     {

         e.Image = (Image.FromFile(@"..\..\Images\location.png"));

         //here display the image with text

         e.DisplayText = (e.Record as Employee).Location.ToString();

         e.TextImageRelation = TextImageRelation.ImageBeforeText;

     }

 }

C# Code Snippet to change the Image when the cell click in SfDataGrid:

//Event subscription

sfDataGrid.CellClick += OnCellClick;

 

//Event Customization

private void OnCellClick(object sender, CellClickEventArgs e)

{

    //Here get the cell clicked data

    var obj = e.DataRow.RowData as Employee;

 

    //Here check the data and change the data based on your scenario

    if (obj.Trustworthiness.ToString() == "Sufficient") //Not playing

    {

        //Here change the value to change the image when cell click in SfDataGrid

        obj.Trustworthiness = "Perfect";

 

    }

    else if (obj.Trustworthiness.ToString() == "Perfect")

    {

        //Here change the value to change the image when cell click in SfDataGrid

        obj.Trustworthiness = "Insufficient";

    }

    else if (obj.Trustworthiness.ToString() == "Insufficient")

    {

        //Here change the value to change the image when cell click in SfDataGrid

        obj.Trustworthiness = "Sufficient";              

    }

}

For more information related to GridImageColumn, please refer to the user guide documentation link,

UG Link: https://help.syncfusion.com/windowsforms/datagrid/columntypes#gridimagecolumn

Please find the sample in the attachment and let us know if you have any concerns about this.

Regards,

Vijayarasan S

If this post is helpful, please consider Accepting it as the solution so that other members can locate it more quickly.

Attachment: Sample_4844e16c.zip

[Leopoldo C.]

It works!

Thank you!

[Vasanthkumar Durairaj]

We are glad that the reported issue was resolved on your side. Please let us know if you need any other details on this. As always, we will be happy to assist you.