Disable selection css

[Wesley]

Hello,

I'm using a radgrid in my solution. I use this radgrid for draging and dropping of data, but nothing needs to be selected. So when a user clicks a row, the row shouldn't change his lay-out to a selected row. But when i disable selecting, drag and drop won't work anymore. It's not that kind of a problem that the user can select a row, but it must be at least invisible for the user because some users can get confused.

Is there a way to ether disable selection but keep drag and dropping or overridage/delete the css of a selected row?
I hope anyone can help me!

Thank you in advance!

Kind regards,
Wesley

p.s. excuse me for my bad English

[Jayesh Goyani]

Hello Wesley,

Please set below Css for your grid.

.RadGrid .rgActiveRow td, .RadGrid .rgHoveredRow td, .RadGrid .rgEditRow td
          {
              border: none !important;
              background: none !important;
          }
          .RadGrid .rgMasterTable .rgSelectedCell, .RadGrid .rgSelectedRow
          {
              border: none !important;
              background: none !important;
          }
          .RadGrid .rgSelectedRow td
          {
              border-bottom-width: 0px !important;
          }

Thanks,
Jayesh Goyani

[Wesley]

Thank you very much for your code, unfortunately this doesn't work as it should be. When I import this code into my css style file, the selected rows become completely white. The text within the selected row, and when I drag the row, it turns also completely white.
The problem is that RadGrid uses ItemStyle and AlternatingItemStyle which means, the even rows are white and the odd rows are lightgrey. When someone selects a row, it should be invisible that he/she selected that row, sow the style of that row, need the stay the way is was before selecting. I tried everything I could with my css file in order to get this job done, but I can't get this the way I want it to be. So if you, or someone else can help me with this, I would appriciate that.

Thank you in advance!

Kind regards,
Wesley Lalieu

In the attachment you can see an image that should make my question more clear.

[Andrey]

Hi,

In order to achieve your goal, you could try using the following CSS classes:

div.RadGrid_[SkinName] .rgSelectedRow td
{
    border-left-width:1px;
    border-bottom:1px solid #d0d7e5;
}

div.RadGrid_[SkinName] .rgSelectedRow,
div.RadGrid_[SkinName] .rgSelectedRow > td
{
    background:none;
}

However, depending on the skin you are using you may need to modify the bottom color border to conform the overall layout.

Give this approach a try and check whether the desired behavior is achieved.

Regards,
Andrey
the Telerik team