Change the background color of the selected cell

I want to do multiple cell selection. When I click the button I add an element to the array. I want to make multiple selections with mouse left click without pressing CTRL key. I want the background color to change so that the selected cell is clear. Please help me this.




1 Reply

SK Sujith Kumar Rajkumar Syncfusion Team November 10, 2021 11:59 AM UTC

Hi Ahmet, 
 
Greetings from Syncfusion support. 
 
Please find the response for your queries below, 
 
Query – 1: “I want to make multiple selections with mouse left click without pressing CTRL key.” 
 
Based on the query we would like to let you know that for multiple cell selection you need to use the CTRL key. This is because when performing mouse click the previous cell selection will be removed and newly clicked cell will be selected. This is the default behavior of the Grid based on its current architecture. So for performing multiple selection we suggest you to use the CTRL key. 
 
Query – 2: “I want the background color to change so that the selected cell is clear.” 
 
You can achieve the requirement of customizing the selected cell’s color by overriding the default cell selection classes added to the Grid’s row cell elements and setting the required background color to it.  
 
This is demonstrated in the below code snippet, 
  
/* Styles are overridden for the selected row cells */ 
.e-rowcell.e-cellselectionbackground { 
    background-color: greenyellow !important; 
} 
 
We have prepared a sample based on this for your reference. You can find it below, 
 
You can also find the list of CSS classes to override for customizing each section styles from the below documentation link,   
  
 
Please get back to us if you require any further assistance. 
 
Regards, 
Sujith R 


Loader.
Up arrow icon