We use cookies to give you the best experience on our website. If you continue to browse, then you agree to our privacy policy and cookie policy. Image for the cookie policy date

Handling the checkbox check event

I have a checkbox in a GridDataControl column.  How can I handle when the checkbox gets checked or not?

4 Replies

BH Brent Hoskisson October 25, 2013 05:55 PM UTC

I found the GridDataControl.CurrentCellChanged event, but now how do I get the new value of the cell?  It doesn't seem to make updates to the underlying model.


KG Kasthuriraja G Syncfusion Team November 25, 2013 12:56 PM UTC

Hi Brent,

We have analyzed your Query.

You can achieve your requirement by using ControlValue.This ControlValue holds the Newly Updated Value.

You can refer the below Code Snippet  to achieve your requirement.

Code snippet [C#]:


this.SyncGrid.CurrentCellChanged += new Syncfusion.Windows.ComponentModel.



void SyncGrid_CurrentCellChanged(object sender, Syncfusion.Windows.ComponentModel.

SyncfusionRoutedEventArgs args)


             var currentcellmanager = this.SyncGrid.Model.CurrencyManager;

             if (currentcellmanager.CurrentCell.HasCurrentCell)


                var currentcell = currentcellmanager.CurrentCell;

                 if (currentcell.Renderer is GridCellCheckboxRenderer)


                      var value = currentcell.Renderer.ControlValue as bool?;

                      if ((bool)value)













We have prepared a sample based on this and you can find the sample under the following location:

Sample : checkboxevent.zip

Please let us know if this helps.



GU Guadalupe March 27, 2019 03:21 PM UTC

It's possible in asp.net?

VN Vignesh Natarajan Syncfusion Team March 29, 2019 10:00 AM UTC

Hi Guadalupe, 
Thanks for using Syncfusion product. 
From your query, we are able to understand that you want to get the row and cell information in the server side, when the checkbox cell is clicked in the grid. To achieve your requirement we suggest you to use the below solution. 
Refer the below code example. 
In the below code example we have used the OnServerRecordClick event to trigger the server side event when the checkbox is clicked. We have canceled the default server side record click event when the record is clicked and triggered the server side event when the checkbox is clicked. 
<asp:UpdatePanel runat="server"> 
            <script type="text/x-jsrender" id="columnTemplate"> 
                <input type="checkbox" id="check{{:EmployeeID}}" onclick="myfunc(event)" name="CheckBoxColumn" /> 
                <ej:Grid ID="FlatGrid" runat="server" AllowSorting="True" AllowPaging="True" IsResponsive="true" OnServerRecordClick="FlatGrid_ServerRecordClick"> 
                        <ej:Column Field="OrderID" HeaderText="Order ID" IsPrimaryKey="True" TextAlign="Right" Width="75" /> 
                        <ej:Column Field="CustomerID" HeaderText="Customer ID" Width="80" /> 
                        <ej:Column Field="EmployeeID" HeaderText="Employee ID" TextAlign="Right" Width="75" Priority="4" /> 
                        <ej:Column Field="Freight" HeaderText="Freight" TextAlign="Right" Width="75" Format="{0:C}" Priority="3" /> 
                        <ej:Column HeaderText="CheckBox" Template="#columnTemplate" TextAlign="Center" Width="110" /> 
                    <ClientSideEvents TemplateRefresh="templaterefresh" RecordClick="RecordClick" ActionComplete="complete" /> 
            <script type="text/javascript"> 
                var id, state; 
                function myfunc(e) { 
                    id = $(e.target).attr("id"); 
                    state = $(e.target).prop("checked"); 
                function triggerEvent(e) { 
                    var obj = $(".e-grid").data("ejGrid"); 
                    var args = { currentTarget: e.currentTarget.name, selectedRecord: obj.getSelectedRecords(), selectedIndex: obj.model.selectedRowIndex }; 
                    obj._trigger("recordClick", args); 
                function RecordClick(e) { 
                    if (e.currentTarget != "CheckBoxColumn") 
                        return false 
                    else { 
                function complete(args) { 
                    setTimeout(function () { 
                        $("#" + id).prop("checked", state); 
                    }, 500) 
We also have a Knowledge base document regarding this issue. Please refer the below link for KB document. 
If we misunderstood, your requirement please get back to us with the following details. 
  1. Share the complete grid code example are you using.
  2. Share your requirement in detail.
Vignesh Natarajan. 

Live Chat Icon For mobile
Up arrow icon