Forums Ignite UI for jQuery
Your Privacy Matters: We use our own and third-party cookies to improve your experience on our website. By continuing to use the website we understand that you accept their use. Cookie Policy
Close
Kenneth Haynes
255
Binding to child column data
posted

I thought I saw an article somewhere about binding a top-level column value to a child row value in a way that would allow for something analogous to:

{ headerText: "Inv Avail. Dt.", key: childRow => Max("AvailDate"), width: "140px", dataType: "date", format: "MM/dd/yyy" }

{ headerText: "Board Feet", key: childRow => Sum("BoardFeet"), width: 85px, dataType: "number", format: "###,###,###" }

Is something like this possible?

Parents
No Data
Reply
  • 29417
    Verified Answer
    Offline posted

    Hello Kenneth,

    Thank you for posting in our forum. 

    You can achieve something similar using the formula property of an unbound column. This will allow you to define a function, which will calculate the value of the current cell based on values in the same record. You can find more information on the formula property and how to use it here: https://www.igniteui.com/help/api/2020.1/ui.iggrid#options:columns.formula

     As the hierarchy data field is part of the parent record data you can use it to get the array of child records and aggregate and display the data you wish to show for that particular column based on those child records.

    For example, if you have a hierarchy where the child records are stored in the Products parent record field and have a Price column in the child that you wish to sum and display the result in the parent, you can define a Sum column in the parent as follows: 

    { headerText: "Sum", key: "Sum", unbound: true, width: "130px", dataType: "number", formula: function(recordData) {
		var products = recordData.Products;
		var sum = 0;
			products.forEach(function(childRec) {
				sum += parseFloat(childRec.Price);
			});
		return sum;
						
	}
}

     I’ve attached a sample that uses this approach for your reference:

    2313.hgrid.sample.zip

    Let me know if this is what you are aiming to achieve.

     Regards,

    Maya Kirova

     

     

Children