Prevent Row Click

[Keivan Kechmiri]

Hi

How can I prevent a user to single click on a row (thereby changing the selected row). I only want the user to be able to double click on a row to change selected row.

I also want to programatically change row (I'm already doing this using set_selected(true);)

I have also changed the CSS for selected row (.rlbSelected) to show a background picture.

I've tried using some javascript to intercept SelectionIndexChanging and set_cancel(true); to prevent single click, but it still changes the focused row thereby causing other problems.

/Keivan

[Gimmik]

Hi Keivan,

That is actually a very interesting question! Honestly - I don't think it's going to be easy to do. I tried making a few sample web applications to see if I could disable row selection on single click. As a client-side event, this might not be possible. Have you considered server-side selection? You can provide a small checkbox on the left of the RadGrid that will be used for selection. Clicking (single or double) the row will have no effect on selection that that point, however each row selection will require a post-back. You may be able to wire-up the client-side Double_Click event into the Server-Side selection event. Then you would be able to effectively hide the selection column. Maybe Telerik support will think of something that I haven't.

-Gimmik

[Peter Filipov]

Hi Keivan,

The custom client-side functionality that you are requiring is not officially supported. By preventing the single click on item, it is not possible to do a double click to select an item after, because there is no information about which item is clicked.
Here is the workaround. Please notice that is not completely tested:

<div>
       <telerik:RadScriptManager runat="server" ID="RadScriptManager" />
       <telerik:RadListBox ID="RadListBox" runat="server" OnClientSelectedIndexChanging="OnClientSelectedIndexChanging">
           <HeaderTemplate>
                Counties</HeaderTemplate>
           <Items>
               <telerik:RadListBoxItem Text="item1" />
               <telerik:RadListBoxItem Text="item2" />
               <telerik:RadListBoxItem Text="item3" />
               <telerik:RadListBoxItem Text="item4" />
               <telerik:RadListBoxItem Text="item5" />
           </Items>
       </telerik:RadListBox>
   </div>
   </form>
   <script type="text/javascript">
       var $ = $telerik.$;
       var interval = 0;

       function OnClientSelectedIndexChanging(sender, args) {
           interval++;
           if (interval == 1) {
               args.set_cancel(true);
               var $item = $(args.get_item()._element);
               $item.attr("class", "rlbItem");
           }
           setTimeout(function () { interval = 0; }, 200);
       }

   </script>

All the best,
Peter Filipov
the Telerik team