New to Telerik UI for ASP.NET AJAX? Download free 30-day trial

ClientEvents Class Members

There are several ways to attach handler to a client-side event of RadGrid.

Attach command string to event

<telerik:RadGrid ID="RadGrid1" runat="server">
    <ClientSettings>
        <ClientEvents OnGridCreating="alert('Creating RadGrid')" />
    </ClientSettings>
</telerik:RadGrid>

Attach function to event

<telerik:RadGrid ID="RadGrid1" runat="server">
    <ClientSettings>
        <ClientEvents OnGridCreating="GridCreating" />
    </ClientSettings>
</telerik:RadGrid>
<script type="text/javascript">
    function GridCreating(sender, eventArgs){
        alert("Creating grid with ClientID: " + sender.get_id());
    }
</script>       

Attach handlers dynamically

<telerik:RadGrid ID="RadGrid1" runat="server">
</telerik:RadGrid>
// Load handler for the Web Application
function f() {
    // Get reference to the Grid
    var grid = $find('<%= RadGrid1.ClientID %>');
    // Attach the event
    grid.add_eventName(eventHandler);  

    // Sys.Application.remove_load(f);
}
// Attached Load event listener to the Web Application
Sys.Application.add_load(f);  

// RadGrid event's handler
function eventHandler(sender, args) {
   //...
}

Here eventName is formed from the names in the table below by removing On and starting with a small letter. For example, attaching an event handler for OnRowContextMenu will look in the following way:

<telerik:RadGrid ID="RadGrid1" runat="server">
    <ClientSettings>
        <ClientEvents OnGridCreating="GridCreating" />
    </ClientSettings>
</telerik:RadGrid>
function GridCreating(sender, args) {
    var grid = sender;
    grid.add_rowContextMenu(onRowContextMenuHandler);
}
function onRowContextMenuHandler(sender, args) {
    // execute logic
}

Please note that the grid and its structure should be created when the event handlers are attached. That is why you cannot attach handlers for the OnXXXCreating and OnXXXCreated events dynamically.

Detach events dynamically

In case event handlers were attached to RadGrid but they are not needed at some point, they can be detached dynamically. For example, having the "OnRowClick" attached in the markup like this:

<telerik:RadGrid ID="RadGrid1" runat="server">
    <ClientSettings>
        <ClientEvents OnRowClick="rowClickHandler" OnGridCreated="gridCreatedHandler" />
    </ClientSettings>
</telerik:RadGrid>

Detaching the "OnRowClick" event once the Grid finished rendering

// function to be executed when clicking on a row
function rowClickHandler(sender, args) {
    // logic for row click
}

// function to be executed when the Grid has finished rendering
function gridCreatedHandler(sender, args) {
    var grid = sender;
    //detatch RowClick event handler, so that the function "rowClickHandler" will not be executed when clickin on a row
    grid.remove_rowClick(rowClickHandler);
}

Inside each RadGrid client-side event handler the first argument passed (sender) will point to the grid client object. The second argument (eventArgs) will hold reference properties/objects dependable on the respective client event. They are listed in the separate help topics linked in the next paragraph.

OnActiveRowChanging String
OnActiveRowChanged String
OnCellDeselecting String
OnCellDeselected String
OnCellSelecting String
OnCellSelected String
OnColumnClick String
OnColumnContextMenu String
OnColumnCreating String
OnColumnCreated String
OnColumnDblClick String
OnColumnDestroying String
OnColumnHiding String
OnColumnHidden String
OnColumnMouseOut String
OnColumnMouseOver String
OnColumnMovingToLeft String
OnColumnMovedToLeft String
OnColumnMovingToRight String
OnColumnMovedToRight String
OnColumnResizing String
OnColumnResized String
OnColumnShowing String
OnColumnShown String
OnColumnSwapping String
OnColumnSwapped String
OnCommand String
OnDataBinding String , meaningful only when RadGrid is bound client-side
OnDataBindingFailed String , meaningful only when RadGrid is bound client-side
OnDataBound String , meaningful only when RadGrid is bound client-side
OnDataSourceResolved String , meaningful only when RadGrid is bound client-side
OnFilterMenuShowing String
OnGridCreating String
OnGridCreated String
OnGridDestroying String
OnGroupCollapsing String, meaningful only when GroupLoadMode="Client"
OnGroupCollapsed String, meaningful only when GroupLoadMode="Client"
OnGroupExpanding String, meaningful only when GroupLoadMode="Client"
OnGroupExpanded String, meaningful only when GroupLoadMode="Client"
OnHeaderMenuShowing String
OnHierarchyCollapsing String, meaningful only when HierarchyLoadMode="Client"
OnHierarchyCollapsed String, meaningful only when HierarchyLoadMode="Client"
OnHierarchyExpanding String, meaningful only when HierarchyLoadMode="Client"
OnHierarchyExpanded String, meaningful only when HierarchyLoadMode="Client"
** OnKeyPress ** String
OnMasterTableViewCreating String
OnMasterTableViewCreated String
OnPopUpShowing String
OnRowClick String
OnRowContextMenu String
OnRowCreating String
OnRowCreated String
OnRowDataBound String
OnRowDblClick String
OnRowDeleting String , meaningful only when GridClientDeleteColumn is used for deleting
OnRowDeleted String , meaningful only when GridClientDeleteColumn is used for deleting
OnRowDeselecting String
OnRowDeselected String
OnRowDestroying String
OnRowDragging String
OnRowDragStarted String
OnRowDropping String
OnRowDropped String
OnRowHiding String
OnRowHidden String
OnRowMouseOut String
OnRowMouseOver String
OnRowResizing String
OnRowResized String
OnRowSelecting String
OnRowSelected String
OnRowShowing String
OnRowShown String
OnTableCreating String
OnTableCreated String
OnTableDestroying String
OnScroll String
OnUserAction String

When the ClientIDMode property of the RadGrid control is set to Static , all row specific client-side events would not fire.

In this article