telerik

KB Article
Home  Support  Knowledge Base  Category  Performing postback from grid client events
(ID#524) Performing postback from grid client events
Rating:
Last Modified: 4/9/2008
 

Article information

Article relates to

RadGrid

Created by

Vlad, Telerik

Last modified

March 14, 2007

Last modified by

Stephen, Telerik

 
HOW-TO
Perform postback from grid client events

SOLUTION 
Below are the main points:
  1. Hook client event/relate attribute of the control which has to perform the postback requests with javascript function (handler) 
  2. Process the postback in the code-behind of the page (managing the RaisePostBackEventHandler).

The example below presents how to perform postback on row double-click and output the clicked row CustomerID field above the grid. There are also four projects attached at the bottom of this thread which show the approach in reality (when the grid resides in a web form and user control). 

ASPX/ASCX

  <script type="text/javascript"> 
      function RowDoubleClick(index) 
      { 
        __doPostBack("<%= RadGrid1.UniqueID %>", "RowDblClicked:" + this.Rows[index].ItemIndex); 
      } 
    </script> 

C#

   protected override void RaisePostBackEvent(IPostBackEventHandler source, string eventArgument) 
    { 
        base.RaisePostBackEvent(source, eventArgument); 
 
        if (source == this.RadGrid1 && eventArgument.IndexOf("RowDblClicked") != -1) 
        { 
            GridDataItem item = RadGrid1.Items[int.Parse(eventArgument.Split(':')[1])]; 
            Response.Write(String.Format("CustomerID:{0}", item.GetDataKeyValue("CustomerID"))); 
        } 
    } 

VB.NET

 Protected Overrides Sub RaisePostBackEvent(ByVal source As IPostBackEventHandler, ByVal eventArgument As String) 
        MyBase.RaisePostBackEvent([source], eventArgument) 
 
        If ([source] Is RadGrid1) And (eventArgument.IndexOf("RowDblClicked") <> -1) Then 
            Dim item As GridDataItem = RadGrid1.Items(Integer.Parse(eventArgument.Split(":"c)(1))) 
            Response.Write([String].Format("CustomerID:{0}", item.GetDataKeyValue("CustomerID"))) 
        End If 
    End Sub  

  

Below is the code for Telerik's RadControls Prometheus version of the sample. The logic is pretty mych the same, with the exception of the fact that the control is Ajaxified via the AjaxManager, and a Label is used to display the result of the postback:

.aspx
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default.aspx.cs" Inherits="_Default" 
    Culture="auto" meta:resourcekey="PageResource1" UICulture="auto" %> 
 
<%@ Register Assembly="RadGrid.Net2" Namespace="Telerik.WebControls" TagPrefix="rad" %> 
<%@ Register Assembly="Telerik.Web.UI" Namespace="Telerik.Web.UI" TagPrefix="telerik" %> 
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml">  
<head runat="server">  
    <title>Untitled Page</title> 
    <style type="text/css">  
      
      
 
    </style> 
</head> 
<body> 
    <form id="form1" runat="server">  
 
         
 
        <asp:ScriptManager runat="server" ID="ScriptManager1">  
        </asp:ScriptManager> 
        <br /> 
        <telerik:RadScriptBlock ID="RadScriptBlock1" runat="server">  
          
         <script type="text/javascript">  
          
            function rowDoubleClick(sender, eventArgs)  
            {              
            __doPostBack("<%= RadGrid1.UniqueID %>", "RowClicked:" + eventArgs.get_itemIndexHierarchical());      
            }              
      
        </script> 
        </telerik:RadScriptBlock> 
          
        &nbsp;  
        <asp:Label runat="server" ID="Label1" > 
        </asp:Label> 
        <telerik:RadGrid ID="RadGrid1" runat="server" DataSourceID="AccessDataSource1" 
            GridLines="None">  
            <MasterTableView AutoGenerateColumns="False" DataKeyNames="CustomerID" DataSourceID="AccessDataSource1">  
                <RowIndicatorColumn Visible="False">  
                    <HeaderStyle Width="20px" /> 
                </RowIndicatorColumn> 
                <ExpandCollapseColumn Resizable="False" Visible="False">  
                    <HeaderStyle Width="20px" /> 
                </ExpandCollapseColumn> 
                <Columns> 
                    <telerik:GridBoundColumn DataField="CustomerID" HeaderText="CustomerID" ReadOnly="True" 
                        SortExpression="CustomerID" UniqueName="CustomerID">  
                    </telerik:GridBoundColumn> 
                    <telerik:GridBoundColumn DataField="CompanyName" HeaderText="CompanyName" SortExpression="CompanyName" 
                        UniqueName="CompanyName">  
                    </telerik:GridBoundColumn> 
                    <telerik:GridBoundColumn DataField="ContactName" HeaderText="ContactName" SortExpression="ContactName" 
                        UniqueName="ContactName">  
                    </telerik:GridBoundColumn> 
                </Columns> 
                <EditFormSettings> 
                    <PopUpSettings ScrollBars="None" /> 
                </EditFormSettings> 
            </MasterTableView> 
              
            <ClientSettings> 
            <ClientEvents OnRowDblClick="rowDoubleClick" /> 
            </ClientSettings>