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 : Nov 16th 2018).
Unfortunately, activation email could not send to your email. Please try again.
Syncfusion Feedback

Unable to display the Children of a Parent Hierarchical view.

Thread ID:

Created:

Updated:

Platform:

Replies:

131451 Jul 10,2017 06:42 PM UTC Jul 12,2017 03:54 PM UTC JavaScript 1
loading
Tags: ejGrid
Ailiam Attobra
Asked On July 10, 2017 06:42 PM UTC

Hello,
I am trying to display a Parent-and-Child type relashionship. I followed your examples and I was able to display the parent but unable to display the child.
SEEBELOW FOR THE CODE. Please notethat the data come from the ASP.MVC controller Action.Can you tell me what I am missing ?
IMPORTANT:
Both Actions (OSWData and OSWDetail) return a JSON Data
JS CODE

<script type="text/javascript">

$(function () {

var ElecInformation = ej.DataManager({ url: "OSWData", adaptor: new ej.UrlAdaptor() });
var ElecDetail = ej.DataManager({ url: "OSWDetail", adaptor: new ej.UrlAdaptor() });

var
detailQuery = new ej.Query();
var detailPromise = ElecDetail.excuteQuery(detailQuery);


var query = new ej.Query();
var promise = ElecInformation.executeQuery(query)
.done(function (e) {

$("#grid").ejGrid({

dataSource: e.result,

allowSorting: true,

allowPaging: true,

columns: [

{ field: "WorkOrder", headerText: 'Work order', width: 75 },

{ field: "Tera", headerText: 'ZZ84 Tera', textAlign: ej.TextAlign.Left, width: 100 },

{ field: "Terc", headerText: 'ZZ84 Terc', textAlign: ej.TextAlign.Left, width: 120 },

{ field: "TotalHrs", headerText: 'Total hours', textAlign: ej.TextAlign.Left, width: 100 },

{ field: "HrsRemaining", headerText: 'Hours remainaing', textAlign: ej.TextAlign.Left, width: 100 }

],

childGrid: {

dataSource: ElecDetail,

queryString: "Order",

allowPaging: true,

columns: [

{ field: "Operation", headerText: 'Operation', width: 75 },

{ field: "Order", headerText: 'Ordre', width: 75 },

{ field: "Item", headerText: 'Article', width: 75 },

]

}

})

})

script>
Thank you in advance
A.A

Vignesh Natarajan [Syncfusion]
Replied On July 12, 2017 03:54 PM UTC

Hi Ailiam, 
  
Thanks for contacting Syncfusion support. We have analyzed your code snippet. The QueryString property field should present in both parent and child grids and querystring act as foreignKey relantionship. So, please ensure that field exist in both the grids. Please refer the below link for help documentation on hierarchical bindings. 
  
  
 Please refer the below code snippet. 
  
            $("#Grid").ejGrid({ 
                dataSource: data, 
  
                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 }, 
                       { field: "Title", headerText: 'Title', textAlign: ej.TextAlign.Left, width: 120 }, 
                       { field: "City", headerText: 'City', textAlign: ej.TextAlign.Left, width: 100 }, 
                       { field: "Country", headerText: 'Country', textAlign: ej.TextAlign.Left, width: 100 } 
                ], 
                childGrid: { 
                   dataSource: dataManger, 
                    queryString: "EmployeeID", 
                    allowPaging: true, 
                    columns: [ 
                      { field: "OrderID", headerText: 'Order ID', textAlign: ej.TextAlign.Right, width: 75 }, 
                      { field: "ShipCity", headerText: 'Ship City', textAlign: ej.TextAlign.Left, width: 100 }, 
                      { field: "Freight", headerText: 'Freight', textAlign: ej.TextAlign.Left, width: 120 }, 
                      { field: "ShipName", headerText: 'Ship Name', textAlign: ej.TextAlign.Left, width: 100 } 
                    ], 
  
Please refer our online example for your reference.  
  
If we misunderstood your query or If your issue is not resolved, please get back to us with 
1. both the table schema of both the grid and full code sample. 
2. share screenshot of script error(if any) . 
  
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.

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

;