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

Canceling DetailsExpand on Grid

Thread ID:





132385 Aug 29,2017 08:13 PM UTC Sep 5,2017 04:08 PM UTC ASP.NET MVC 3
Tags: Grid
Eric Outley
Asked On August 29, 2017 08:13 PM UTC

I'm trying to cancel the DetailsExpand event on the grid for records that do not have children.  I took out all of the extra code and just put this in:

    function grid_DetailsExpand(e) {
        e.cancel = true;

And the event is still firing.  How do you cancel the event?  Am I missing something?


Farveen Sulthana Thameeztheen Basha [Syncfusion]
Replied On August 30, 2017 04:14 PM UTC

Hi Eric, 

Thanks for contacting Syncfusion Support. 

We need some additional information to achieve your requirement. Could you please share us the following details given below. 

1. Exact scenario you need to achieve. 

2. Have you used Hierarchy Grid or Detail Template in your sample project. 

3. Do you want to hide the  expand/collapse icon or else you don’t want to expand the Grid when there is no children. 

4. Screenshot/Video about your requirement. 

5. Code example. 

The provided information will help us to analyze and provide you the solution as early as possible.     

Farveen sulthana T 

Eric Outley
Replied On August 30, 2017 09:37 PM UTC

I using a Hierarchy Grid.

What I'm trying to accomplish is that if a row doesn't have children, then I don't want the empty row to show (or not have the row to expand). 

See image below:

I would prefer not to display the expand/collapse icon if possible.  

I was calling the DetailsExpand event on the grid and trying to cancel it, but the event never cancels.

    function grid_DetailsExpand(e) {

        e.cancel = true;



Farveen Sulthana Thameeztheen Basha [Syncfusion]
Replied On September 5, 2017 04:08 PM UTC

Hi Eric, 

We have achieved your requirement using “rowDataBound”  event of the Grid. In the rowDataBound event of the Grid, we have filtered the child Grid records using Employee ID value.  Also we have hide the expand/collapse icon when there is no data for the child Grid. 

Refer to the API link :- 

Please refer to the code example:- 

    <div class="content-container-fluid"> 
        <div class="row"> 
            <div class="cols-sample-area"> 
                <div id="Grid"></div> 
    <script type="text/javascript"> 
        var Data = [ 
        { EmployeeID: 0, FirstName: 'VINET', Title: 'SalesRepresentative', Country: 'USA' }, 
        { EmployeeID: 1, FirstName: 'HANAR', Title: 'SalesRepresentative', Country: 'USA' }, 
            .  .  . 
       $(function () { 
                dataSource: Data, 
                rowDataBound: "rowdatabound", 
                allowSorting: true, 
                columns: [ 
                       { field: "EmployeeID", headerText: 'Employee ID', textAlign: ej.TextAlign.Right, width: 75 }, 
                       { field: "FirstName", headerText: 'First Name', textAlign: ej.TextAlign.Left, width: 100 }, 
                childGrid: { 
                    dataSource: window.gridData, 
                    queryString: "EmployeeID", 
        function rowdatabound(args) { 
            var filter = args.rowData.EmployeeID; 
            var data = ej.DataManager(window.gridData).executeLocal(ej.Query().where("EmployeeID", "equal", parseInt(filter), true)); 
            if (data.length == 0) { 


Farveen sulthana T 


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

or the page will be automatically redirected to 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