Disable background change and border when clicking on cell

[Pieterjan van der Leur]

When i click on a table cell, it gets a darker grey then the rest of the row and also a border.

I want to not have any style change happening when clicking on a row. I just want the same background color as the hover color. 

[Naveen Palanivel]

Hi Pieterjan,

Greetings from Syncfusion support

We checked your query and we would like to inform that we Disable background change and border when clicking on cell by using Css style. We attached the code snippet below . please refer the code snippet for your reference.

<style>

 

  .e-grid td.e-rowcell.e-focus.e-focused{

 

      display: none;

 

  }

</style>

Please let us know if you have any concerns.

Regards,

Naveen Palanivel

[Pieterjan van der Leur]

The problem started with the 20.3.0.58 version, rolling back to 20.3.0.57 solved it, even without display none

[Naveen Palanivel]

We'd like to inform you that in the most recent version 20.3.0.58, we changed some grid behaviour by adding focus to the selected cell. If you want to remove that focus, you can remove it by mentioning it in the previous update's CSS style.

Please let us know if you have any concerns.

[Matthew Paul]

If anyone else comes across this, the 'display:none' css above introduces some weird flickering artifacts when clicking on the table e.g. sorting etc. as well as some difficulties with Playwright on automated e2e tests. If you hide the box shadow effect instead, you get a better result.

/* Hide sf grid cell focus outline */
.e-grid td.e-rowcell.e-focus.e-focused {
    box-shadow: none !important;
}


.e-grid td.e-groupcaption .e-focus.e-focused {
    box-shadow: none !important;
}


.e-grid th.e-headercell.e-focus.e-focused {
    box-shadow: none !important;
}

[Prathap Senthil]

Hi Matthew ,

We are unable to reproduce the reported issue when attempting to reproduce the issue. For your reference, we have attached a GIF file and a simple sample. So, to
further proceed with the reporting problem, we require some additional clarification from your end. Please share the below details to proceed further at our end.

• Please share a video demonstration of the issue along with the steps to replicate it. Additionally, could you confirm whether you are experiencing the flickering issue when using the grouping feature or without the grouping feature?
• Share with us the way you have referred scripts and styles at your end.
• To analyze the reported issue, could you please share a simple and reproducible sample that demonstrates the problem? This will assist us in identifying the issue more efficiently and providing a resolution.
• If possible, kindly share your attempt to replicate the issue using the attached simple sample.

Above-requested details will be very helpful in validating the reported query at our end and providing a solution as early as possible. Thanks for your understanding.

Sample: https://blazorplayground.syncfusion.com/embed/VNrSjsZPJNTgmwRt?appbar=true&editor=true&result=true&errorlist=true&theme=bootstrap5


Regards,
Prathap Senthil

[Prathap Senthil]

Please refer to the attached gif file for your reference.

Attachment: GIF_Grid_1ef9163f.zip

[Matthew Paul]

Hi Prathap, I've sent you a repro and video for this in ticket 668896

[Prathap Senthil]

Thanks for the update,

It seems that you have already reported the issue in our Syncfusion support portal. For further updates, we suggest you follow up on that ticket. Thanks for your understanding.