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. (Last updated on: November 16, 2018).
Unfortunately, activation email could not send to your email. Please try again.
Syncfusion Feedback

Handling the checkbox check event

Thread ID:

Created:

Updated:

Platform:

Replies:

143616 Oct 25,2013 01:31 PM UTC Mar 29,2019 10:00 AM UTC Angular 4
loading
Tags: ejGrid
Brent Hoskisson
Asked On October 25, 2013 01:31 PM UTC

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


Brent Hoskisson
Replied On 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.

 


Kasthuriraja G [Syncfusion]
Replied On 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.

GridRoutedEventHandler(SyncGrid_CurrentCellChanged); 

 

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)

                    {

                        MessageBox.Show("CHECKED");

                    }

                        else

                    {

                        MessageBox.Show("UNCHECKED");

                    }

 

                }

 

            }

 

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.

Thanks/Regards,

Kasthuriraja.G


Guadalupe
Replied On March 27, 2019 03:21 PM UTC

Hello 
It's possible in asp.net?

Vignesh Natarajan [Syncfusion]
Replied On 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"> 
        <ContentTemplate> 
            <script type="text/x-jsrender" id="columnTemplate"> 
                <input type="checkbox" id="check{{:EmployeeID}}" onclick="myfunc(event)" name="CheckBoxColumn" /> 
            </script> 
            <div> 
                <ej:Grid ID="FlatGrid" runat="server" AllowSorting="True" AllowPaging="True" IsResponsive="true" OnServerRecordClick="FlatGrid_ServerRecordClick"> 
                    <Columns> 
                        <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" /> 
                    </Columns> 
                    <ClientSideEvents TemplateRefresh="templaterefresh" RecordClick="RecordClick" ActionComplete="complete" /> 
                </ej:Grid> 
            </div> 
 
 
            <script type="text/javascript"> 
 
                var id, state; 
 
                function myfunc(e) { 
                    id = $(e.target).attr("id"); 
                    state = $(e.target).prop("checked"); 
                    triggerEvent(e); 
                } 
 
                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 { 
                        triggerEvent(e); 
                    } 
                } 
 
                function complete(args) { 
                    setTimeout(function () { 
                        $("#" + id).prop("checked", state); 
                    }, 500) 
                } 
            </script> 
        </ContentTemplate> 
    </asp:UpdatePanel> 
 
 
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.
 
Regards, 
Vignesh Natarajan. 
 


CONFIRMATION

This post will be permanently deleted. Are you sure you want to continue?

Sorry, An error occured while processing your request. Please try again later.

Please sign in to access our forum

This page will automatically be redirected to the sign-in page in 10 seconds.

Warning Icon You are using an outdated version of Internet Explorer that may not display all features of this and other websites. Upgrade to Internet Explorer 8 or newer for a better experience.Close Icon

;