How to select row in grid combining checkbox selection and basic selection

[Anuar Raad Licona]

Hi, I'm using syncfusion grid, now I see in the page  the use of checkboxselection

http://asp.syncfusion.com/demos/web/grid/checkboxselection.aspx

Now when the row is selected in another column different of the checkboxcolumn the event not work.

Exist a form of combine the basic selection with the checkbox selection, I need the checkbox but also the user select the row in any cell

[Jayaprakash Kamaraj]

Hi Anuar, 

Thank you for contacting Syncfusion support. 

We have achieved your requirement using recordClick event of ejGrid. In this event , we need to pass rowIndex in selectRows method when checkSelectedRowsIndexes as null or undefined else we need to push selected row index into checkSelectedRowsIndexes and then we need to pass checkSelectedRowsIndexes in selectRows method of Grid. Please refer to the below help document, code example and sample. 

https://help.syncfusion.com/api/js/ejgrid#methods:selectrows 

https://help.syncfusion.com/api/js/ejgrid#events:recordclick 

<asp:Content ID="Content2" ContentPlaceHolderID="MainContent" runat="server"> 

             <div> 

        <asp:UpdatePanel runat="server"> 

            <ContentTemplate> 

                <ej:Grid ID="OrdersGrid" runat="server" ClientIDMode="Static" AllowPaging="True"   > 

                    <ClientSideEvents RecordClick="recordClick" /> 

                    <Columns> 

                        <ej:Column Type="checkbox" Width="90"></ej:Column> 

.. 

                  

                </ej:Grid> 

            </ContentTemplate> 

        </asp:UpdatePanel> 

        <script type="text/javascript"> 

        function recordClick(args) { 

            var index = this.model.pageSettings.currentPage - 1; 

            if (!($(args.cell).hasClass("e-checkcell"))) { 

                if (ej.isNullOrUndefined(this.checkSelectedRowsIndexes[index])) 

                    this.selectRows(args.rowIndex); 

                else if ($(args.row).attr("aria-selected")) { // Deselecting 

                    $(args.row).removeAttr("aria-selected").find(".e-selectionbackground").removeClass("e-selectionbackground").removeClass("e-active"); 

                    var checkBoxIndex = $.inArray(args.rowIndex, this.checkSelectedRowsIndexes[index]); 

                    this.checkSelectedRowsIndexes[index].splice(checkBoxIndex, 1); 

                    $(args.row).find(".e-checkcelldiv [type=checkbox]").prop("checked", false); 

                } 

                else { 

                    this.checkSelectedRowsIndexes[index].push(args.rowIndex); 

                    this.selectRows(this.checkSelectedRowsIndexes[index]); 

                } 

            } 

        } 

    </script> 

 

</asp:Content> 

Sample: http://www.syncfusion.com/downloads/support/forum/130744/ze/SyncfusionASPNETApplication46-650651646 

Regards, 

Jayaprakash K.