Prevent server side event when click on template field button

[Kavishka Subashana]

Hello,

I'm using 2 template buttons and server side method (OnServerRecordClick). When i try to click on the template buttons. Its going to server and hitting  OnServerRecordClick method. Can i stop this when i click on the button?

Thank you

Control Code - 

 <ej:Grid ID="grdLiens_New" EnablePersistence="false" runat="server" OnServerRecordClick="grdLiens_New_ServerRecordClick" AutoGenerateColumns="false" ClientIDMode="Static" AllowFiltering="True" AllowGrouping="true" AllowPaging="True" AllowReordering="true" AllowSorting="true" AllowResizing="true">

                    <%--<DataManager CrossDomain="true" URL="/AMS_WEB/Common/Web Services/AMS_WebService.asmx/grdLiens_New_DataSource" Adaptor="WebMethodAdaptor" />--%>

                     <ResizeSettings ResizeMode="NextColumn"></ResizeSettings>

                    <EditSettings AllowAdding="true" />

                    <ClientSideEvents DataBound="Liens_dataBound" RowSelected="Lien_RowSelected" RecordClick="recordclick" ActionComplete="Liens_Action_Complete" ActionBegin="begin" />

                    <Columns>

                        <ej:Column Field="Lien_Id" HeaderText="Lien_Id" IsPrimaryKey="True" TextAlign="Right" Visible="false" />

                        <ej:Column Field="Docket_Number" HeaderText="Docket Number" Tooltip= "#colTip"/>

                         <ej:Column Field="Lien_Date" HeaderText="Lien Date" Type="date" Format="{0:MM/dd/yyyy}" Tooltip= "#colTip"/>

                        <ej:Column Field="Lien_Amount" HeaderText="Amount" Type="number" TextAlign="Right" Tooltip= "#colTip"/>

                         <ej:Column Field="Lien_Satisfaction_Date" HeaderText="Satisfaction Date" Type="date" Format="{0:MM/dd/yyyy}" Tooltip= "#colTip"/>

                        <ej:Column Field="Lien_Satisfaction_Method" HeaderText="Satisfaction Method" Tooltip= "#colTip"/>

                        <ej:Column Field="Lien_Status" HeaderText="Status" Tooltip= "#colTip"/>

                        <ej:Column HeaderText="Manage Records" Width="10%">

                            <Command>

                                <ej:Commands Type="edit">

                                    <ButtonOptions CssClass="e_Editbutton" Click="edit_onClick" ></ButtonOptions>

                                </ej:Commands>

                                <ej:Commands Type="delete">

                                    <ButtonOptions CssClass="e_Deletebutton" Click="delete_onClick"></ButtonOptions>

                                </ej:Commands>

                            </Command>

                        </ej:Column>

                    </Columns>

                    <PageSettings PageSize="7" />

                    <ToolbarSettings ShowToolbar="True" ToolbarItems="search,excelExport"></ToolbarSettings>

                    <FilterSettings FilterType="Excel"></FilterSettings>

                </ej:Grid>

[Farveen Sulthana Thameeztheen Basha]

Hi Kavishka,

We have achieved your requirement using RecordClick event of the TreeGrid. In this event, based on Command buttons from target we have prevented this OnServerRecordClick event of the Grid by setting args.cancel as true.

Refer to the code below:-

<ej:Grid ID="grdLiens_New" EnablePersistence="false" runat="server" OnServerRecordClick="grdLiens_New_ServerRecordClick" AutoGenerateColumns="false" ClientIDMode="Static" AllowFiltering="True" AllowGrouping="true" AllowPaging="True" AllowReordering="true" AllowSorting="true" AllowResizing="true">

                     <ResizeSettings ResizeMode="NextColumn"></ResizeSettings>

                    <ClientSideEvents DataBound="Liens_dataBound" RowSelected="Lien_RowSelected" RecordClick="recordclick" ActionComplete="Liens_Action_Complete" ActionBegin="begin" />

 

                    <Columns>

 

                                  .       .      .

 

                        <ej:Column Field="Lien_Status" HeaderText="Status" Tooltip= "#colTip"/>

 

                        <ej:Column HeaderText="Manage Records" Width="10%">

 

                            <Command>

 

                                <ej:Commands Type="edit">

 

                                    <ButtonOptions CssClass="e_Editbutton" Click="edit_onClick" ></ButtonOptions>

 

                                </ej:Commands>

 

                                <ej:Commands Type="delete">

 

                                    <ButtonOptions CssClass="e_Deletebutton" Click="delete_onClick"></ButtonOptions>

 

                                </ej:Commands>

 

                            </Command>

 

                        </ej:Column>

 

                    </Columns>

 

                </ej:Grid>  

               

                  <script>

                      function recordclick(args) {

                          if ($(args.event.target).hasClass("e-editbutton") || $(args.event.target).hasClass("e-deletebutton")) {

                              args.cancel = true;       //prevent serverRecordClick on clicking the buttons

                          }

                      }

                  </script>

Please get back to us if you need any further assistance on this.

Regards,
Farveen sulthana T