We use cookies to give you the best experience on our website. If you continue to browse, then you agree to our privacy policy and cookie policy. Image for the cookie policy date

Remove focus rectangle

How do I remove the focus rectangle when the user clicks on a row in the grid?






Thanks,


Mike





3 Replies

PS Prathap Senthil Syncfusion Team February 16, 2023 05:13 AM UTC

Hi Mike,

Greetings from Syncfusion,

Query:” How do I remove the focus rectangle when the user clicks on a row in the grid?”

To remove the focus, we remove the border from the selected row cell and column header using CSS style. Here is a code snippet that you can use for your reference:

<style>

 

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

 

    box-shadow:none;

 

  }

 

  .e-grid th.e-headercell.e-focus.e-focused{

         box-shadow:none;

  }

 

</style>

 


Regards,
Prathap S



MC Mike Chafin February 17, 2023 02:47 PM UTC



PS Prathap Senthil Syncfusion Team February 20, 2023 05:12 PM UTC

Thanks for the Update,

We have tried reproducing the issue in our recent version (20.4.0.50) but were unable to do so. We recommend upgrading to the latest version of our software to see if that resolves the issue. We have included a screenshot and sample for your reference.


In order to assist in troubleshooting the issue, we kindly request that you provide a simple reproducible sample or if possible, try modifying the attached sample to see if the issue can be reproduced there. We appreciate your cooperation and hope to resolve this issue for you as soon as possible.


Attachment: BlazorDataGrid_b329b77d.zip

Loader.
Up arrow icon