I am using radgrid and GridClientSelectColumn. When I select a row, the row is highligted with gray color. I guess thats like default skin. How I can set the selected row background color to none. I just want to be able to check the box and uncheck with no background color for the row.
Do I have to use onRowSelecting or onRowSelected event? If so, how can I get the selected row item on the clientside.
Do I have to use onRowSelecting or onRowSelected event? If so, how can I get the selected row item on the clientside.
5 Answers, 1 is accepted
0
Princy
Top achievements
Rank 2
Rank 2
answered on 09 Nov 2009, 05:04 AM
Hello,
You can try out the following css setting to change the background color of the selected row:
css:
Hope this helps..
Princy.
You can try out the following css setting to change the background color of the selected row:
css:
| .rgSelectedRow |
| { |
| background:none !important; |
| color: black !important; |
| } |
| .rgSelectedRow a |
| { |
| color: black !important; |
| } |
Hope this helps..
Princy.
0
cognos s
Top achievements
Rank 1
Rank 1
answered on 09 Nov 2009, 03:33 PM
I have the code like this...can you tell me where I have to specify the style.
function rowSelected() {
customerIds = ""
;
var tableView = $find('<%= grid1.ClientID %>').get_masterTableView();
//I get the selected items here. How do I know the selected item index and specify the style?
var dataItems = tableView.get_selectedItems();
}
0
Schlurk
Top achievements
Rank 2
Rank 2
answered on 09 Nov 2009, 10:15 PM
You set the CSS in the <head></head> tags of your .aspx page as follows:
| <head> |
| <title></title> |
| <style type="text/css"> |
| rgSelectedRow |
| { |
| background:none !important; |
| color: black !important; |
| } |
| .rgSelectedRow a |
| { |
| color: black !important; |
| } |
| </style> |
| </head> |
0
cognos s
Top achievements
Rank 1
Rank 1
answered on 09 Nov 2009, 11:29 PM
Hi Schlurk,
Its kinda working but not completely. for the selected item the row is highligted with black border. I do not want. pls see the attachment. I would like the grey color to be like that.
could you also explain how this css style works(I didnt define any css class for the radgrid). what if I have two radgrid's in the page. will it be applied for both grids?
Its kinda working but not completely. for the selected item the row is highligted with black border. I do not want. pls see the attachment. I would like the grey color to be like that.
could you also explain how this css style works(I didnt define any css class for the radgrid). what if I have two radgrid's in the page. will it be applied for both grids?
0
Accepted
Schlurk
Top achievements
Rank 2
Rank 2
answered on 10 Nov 2009, 05:46 PM
You can fix that by doing the following (compare it to what Princy posted to see the differences):
What you are doing above is basically over-writing some of the CSS found within each one of the Telerik embedded skins. The !important tag increases the CSS Specificity which forces your custom CSS to be used instead of the default Telerik CSS.
| <style type="text/css"> |
| .rgSelectedRow |
| { |
| background: none !important; |
| color: black !important; |
| } |
| .rgSelectedRow td |
| { |
| border: none !important; |
| } |
| .rgSelectedRow a |
| { |
| color: black !important; |
| } |
| </style> |
What you are doing above is basically over-writing some of the CSS found within each one of the Telerik embedded skins. The !important tag increases the CSS Specificity which forces your custom CSS to be used instead of the default Telerik CSS.