This is a migrated thread and some comments may be shown as answers.

RadGrid OnRowClick and OnRowDblClick

3 Answers 124 Views
Grid
This is a migrated thread and some comments may be shown as answers.
Sheetal
Top achievements
Rank 1
Sheetal asked on 16 Sep 2013, 11:57 AM
First Row in the Grid always invoke OnRowClick event even if row is double clicked. For other rows it works max time but for few instances they also don't work. Please let me know how to resolve.
<telerik:RadGrid ID="grdMain" runat="server" AutoGenerateColumns="false" AllowSorting="True"
                               GridLines="None" CellSpacing="0" OnPreRender="grdMain_PreRender" OnSortCommand="grdMain_SortCommand"
                               OnNeedDataSource="grdMain_NeedDataSource" ClientSettings-ColumnsReorderMethod="Reorder"
                               ClientSettings-ReorderColumnsOnClient="true" PagerStyle-AlwaysVisible="true"
                               EnableHeaderContextMenu="true" PageSize="25" Width="100%" AllowPaging="true"
                               PagerStyle-Position="Top" PagerStyle-Mode="NextPrevNumericAndAdvanced" Height="100%">
                               <MasterTableView DataKeyNames="GridNbr" AutoGenerateColumns="false" EnableColumnsViewState="true"
                                   ClientDataKeyNames="GridNbr" TableLayout="Auto" Width="100%">
                                   <Columns>
                                       <telerik:GridBoundColumn UniqueName="GridNbr" SortExpression="GridNbr" HeaderText="GridNbr"
                                           DataField="GridNbr" DataFormatString="{0}">
                                       </telerik:GridBoundColumn>
                                       <telerik:GridBoundColumn UniqueName="Department" SortExpression="Department" HeaderText="Department"
                                           DataField="Department" Resizable="true" DataFormatString="<nobr>{0}</nobr>">
                                       </telerik:GridBoundColumn>
                                       <telerik:GridBoundColumn UniqueName="Product" SortExpression="Product" HeaderText="Product"
                                           DataField="Product" Resizable="true" DataFormatString="<nobr>{0}</nobr>">
                                       </telerik:GridBoundColumn>
                                       <telerik:GridBoundColumn UniqueName="Program" SortExpression="Program" HeaderText="Program"
                                           DataField="Program" Resizable="true" DataFormatString="<nobr>{0}</nobr>">
                                       </telerik:GridBoundColumn>
                                       <telerik:GridBoundColumn UniqueName="MarketingName" SortExpression="MarketingName"
                                           HeaderText="MarketingName" DataField="MarketingName" Resizable="true" DataFormatString="<nobr>{0}</nobr>">
                                       </telerik:GridBoundColumn>
                                       <telerik:GridBoundColumn UniqueName="Effort" SortExpression="Effort" HeaderText="Effort"
                                           DataField="Effort" Resizable="true" DataFormatString="<nobr>{0}</nobr>">
                                       </telerik:GridBoundColumn>
                                       <telerik:GridBoundColumn UniqueName="Campaigndate" SortExpression="Campaigndate"
                                           HeaderText="CampaignDate" DataField="Campaigndate" Resizable="true" DataFormatString="<nobr>{0}</nobr>">
                                       </telerik:GridBoundColumn>
                                       <telerik:GridBoundColumn UniqueName="Project" SortExpression="Project" HeaderText="Project"
                                           DataField="Project" Resizable="true" DataFormatString="<nobr>{0}</nobr>">
                                       </telerik:GridBoundColumn>
                                       <telerik:GridBoundColumn UniqueName="ControlDesc" SortExpression="ControlDesc" HeaderText="Control Description"
                                           DataField="ControlDesc" Resizable="true" DataFormatString="<nobr>{0}</nobr>">
                                       </telerik:GridBoundColumn>
                                       <telerik:GridBoundColumn UniqueName="Offer" SortExpression="Offer" HeaderText="Offer"
                                           DataField="Offer" Resizable="true" DataFormatString="<nobr>{0}</nobr>">
                                       </telerik:GridBoundColumn>
                                       <telerik:GridBoundColumn UniqueName="Revision" SortExpression="Revision" HeaderText="Revision#"
                                           DataField="Revision" Resizable="true" DataFormatString="<nobr>{0}</nobr>">
                                       </telerik:GridBoundColumn>
                                       <telerik:GridBoundColumn UniqueName="DBMProjectID" SortExpression="DBMProjectID"
                                           HeaderText="DBMProjectID" DataField="DBMProjectID" Resizable="true" DataFormatString="<nobr>{0}</nobr>">
                                       </telerik:GridBoundColumn>
                                       <%-- <telerik:GridBoundColumn UniqueName="DBMContact" SortExpression="DBMContact" HeaderText="DBMContact"
                                       DataField="DBMContact" Resizable="true" DataFormatString="<nobr>{0}</nobr>">
                                   </telerik:GridBoundColumn>--%>
                                       <telerik:GridBoundColumn UniqueName="Blank" SortExpression="Blank" HeaderText=" "
                                           DataField="Blank" Resizable="true">
                                       </telerik:GridBoundColumn>
                                   </Columns>
                               </MasterTableView>
                               <ClientSettings AllowColumnsReorder="true" Selecting-AllowRowSelect="true" EnableRowHoverStyle="true"
                                   EnablePostBackOnRowClick="false">
                                   <Selecting AllowRowSelect="true" />
                                   <ClientEvents OnRowClick="RowClick" OnRowDblClick="RowDblClick" OnColumnShown="RefreshGrid"
                                       OnColumnHidden="RefreshGrid"></ClientEvents>
                                   <Scrolling AllowScroll="True" UseStaticHeaders="True" SaveScrollPosition="true" ScrollHeight="90%" />
                                   <%--<Scrolling AllowScroll="True" UseStaticHeaders="false" ScrollHeight="370px" />--%>
                                   <Resizing AllowRowResize="false" EnableRealTimeResize="false" ResizeGridOnColumnResize="false"
                                       AllowColumnResize="True" ClipCellContentOnResize="false" AllowResizeToFit="true">
                                   </Resizing>
                               </ClientSettings>
                           </telerik:RadGrid>
 
var isDoubleClick = false;
                       var clickHandler = null;
                       var ClickedIndex = null; // newly added
 
                       // single click
                       function RowClick(sender, args) {
                           ClickedIndex = args._itemIndexHierarchical; // newly added
                           isDoubleClick = false;
                           if (clickHandler) {
                               window.clearTimeout(clickHandler);
                               clickHandler = null;
                           }
                           clickHandler = window.setTimeout(ActualClick, 200);
 
                       }
                       // Double click
                       function RowDblClick(sender, args) {
                           ClickedIndex = args._itemIndexHierarchical; // newly added
                           isDoubleClick = true;
                           if (clickHandler) {
                               window.clearTimeout(clickHandler);
                               clickHandler = null;
                           }
                           clickHandler = window.setTimeout(ActualClick, 200);
                       }
 
                       function ActualClick() {
                           if (isDoubleClick) {
                               var grid = $find("<%=grdMain.ClientID %>");
                               if (grid) {
                                   var MasterTable = grid.get_masterTableView();
                                   var GridNbr = MasterTable.get_selectedItems()[0].get_cell("GridNbr").innerText;
                                   var Mode = "Open";
                                   var oWnd = window.radopen("GridEntry.aspx?GridNbr=" + GridNbr + "&Mode=" + Mode, "RadWindow1");
 
                                   oWnd.SetSize(1200, 530);
                                   oWnd.set_visibleStatusbar(false);
                                   oWnd.center();
                                   return false;
                               }
                           }
                           else {
                               var radMgr = $find("<%=RadAjaxManager1.ClientID %>");
                               radMgr.ajaxRequest("RowClick");
                               return false;
                           }
                       }

3 Answers, 1 is accepted

Sort by
0
Jayesh Goyani
Top achievements
Rank 2
answered on 16 Sep 2013, 12:45 PM
Hello,

I have tried with the below code snippet and i am not able to reproduce this issue for first row.
Can you please try with this code and check that this issue raised for specific browser or data?
If you still not able to reproduce this issue then please provide your full code with data.
Let me know if any concern.

<script type="text/javascript">
            var isDoubleClick = false;
            var clickHandler = null;
            var ClickedIndex = null;
 
            function RowClick(sender, args) {
                ClickedIndex = args._itemIndexHierarchical;
                isDoubleClick = false;
                if (clickHandler) {
                    window.clearTimeout(clickHandler);
                    clickHandler = null;
                }
                clickHandler = window.setTimeout(ActualClick, 200);
            }
 
            function RowDblClick(sender, args) {
                ClickedIndex = args._itemIndexHierarchical;
                isDoubleClick = true;
                if (clickHandler) {
                    window.clearTimeout(clickHandler);
                    clickHandler = null;
                }
                clickHandler = window.setTimeout(ActualClick, 200);
            }
 
            function ActualClick() {
                if (isDoubleClick) {
                    alert('Double Click');
                }
                else {
                    alert('Single Click');
                }
            }
        </script>
<telerik:RadGrid ID="RadGrid1" runat="server" AutoGenerateColumns="false" OnNeedDataSource="RadGrid1_NeedDataSource">
        <MasterTableView DataKeyNames="ID" CommandItemDisplay="Top">
            <Columns>
                <telerik:GridBoundColumn DataField="ID" UniqueName="ID" HeaderText="ID">
                </telerik:GridBoundColumn>
                <telerik:GridBoundColumn DataField="Name" UniqueName="Name" HeaderText="Name">
                </telerik:GridBoundColumn>
                <telerik:GridEditCommandColumn>
                </telerik:GridEditCommandColumn>
            </Columns>
        </MasterTableView>
        <ClientSettings>
            <ClientEvents OnRowDblClick="RowDblClick" OnRowClick="RowClick" />
        </ClientSettings>
    </telerik:RadGrid>
protected void RadGrid1_NeedDataSource(object sender, GridNeedDataSourceEventArgs e)
    {
        dynamic data1 = new[] {
               new { ID = 1, Name ="Name_1",IsAllowSelect = true},
               new { ID = 2, Name = "Name_2",IsAllowSelect = false},
               new { ID = 3, Name = "Name_3",IsAllowSelect = false},
               new { ID = 4, Name = "Name_4",IsAllowSelect = true},
               new { ID = 5, Name = "Name_5",IsAllowSelect = true}
           };
        RadGrid1.DataSource = data1;
    }


Thanks,
Jayesh Goyani
0
Sheetal
Top achievements
Rank 1
answered on 17 Sep 2013, 06:12 AM
Hi Jayesh,

I tried below Code and found
In IE
If you do single click first time it show  correct message "Single Click" again if you do double click on same record it will again show you "Single Click". You need to click again for message "Double Click" and same goes for first time Double Click.

Step 1: Single Click
Msg : "Single Click"
Step 2: Double Click
Msg: "Single Click"
Step 3: Double Click
Msg: "Double Click"

In Mozilla
First time click works but after that it always gives "Single Click" msg for Single or Double click.

Please let me know how can I resolve the issue.

Thanks
Sheetal

0
Vasil
Telerik team
answered on 17 Sep 2013, 09:00 AM
Hello Sheetal,

You can refactor your code similar way to avoid the described problems:

function RowClick(sender, args) {
   var radMgr = $find("<%=RadAjaxManager1.ClientID %>");
   radMgr.ajaxRequest("RowClick");
}
function RowDblClick(sender, args) {
   var grid = $find("<%=grdMain.ClientID %>");
   if (grid) {
      var MasterTable = grid.get_masterTableView();
      var GridNbr = MasterTable.get_selectedItems()[0].get_cell("GridNbr").innerText;
      var Mode = "Open";
      var oWnd = window.radopen("GridEntry.aspx?GridNbr=" + GridNbr + "&Mode=" + Mode, "RadWindow1");
       oWnd.SetSize(1200, 530);
      oWnd.set_visibleStatusbar(false);
      oWnd.center();
      return false;
   }
 }

I hope this helps.

Regards,
Vasil
Telerik
If you want to get updates on new releases, tips and tricks and sneak peeks at our product labs directly from the developers working on the RadControls for ASP.NET AJAX, subscribe to the blog feed now.
Tags
Grid
Asked by
Sheetal
Top achievements
Rank 1
Answers by
Jayesh Goyani
Top achievements
Rank 2
Sheetal
Top achievements
Rank 1
Vasil
Telerik team
Share this question
or