This is runnable code. Please look into this.
Support Forum
Hi,
Thanks for the runnable test app.
Please follow the suggestions below.
- The
foreignKey
should be the field in a Model that has the id of a related Model. I the "OrdersDetail" Model, there should be apoSalesOrderId
or something similar, that points to the related "POSalesOrder's" id - That field should also be used as the
foreignKey
of the relationship between "OrdersDetail" and "POSalesOrder" - The "OrdersDetail" Model should have it's own unique identifier id
- The "Deliveries" Model should have a field that points to the related "OrdersDetal's"
id
. Something likeordersDetailId
- That field should be used as the
foreignKey
of the relationship between "Deliveries" and "OrdersDetail" - The
dataField
for the out-most grid (containing "POSalesOrder") rowExpander should beorderRows
- The
dataField
for the middle grid (containing "OrdersDetail") rowExpander should bedeliveryRows
And about this
return orderRows.reduce((acc: any, r: any) => acc + r.OrderTotalAmount, 0);
you should use this.orderRows
If you have any questions please let us know
Best regards,
Tasnim
Hi,
Please check the edited app attached below (with that error solved)
- Attachments
-
- code edited.zip
- (423.78 KiB) Downloaded 14 times
Thank you, I downloaded your code and applied some changes to show children data and its working.
Now the problem is, parent row data s not refreshed when changing child row data. Actually, in parent row, there is a column TotalAmount which is calculated on the basis of children row's data. Whenever I am changing value in child row it should recalculate parent row TotalAmount field, but its not calculating on change instead it calculating when I collapse parent row.
In Bryntum example (https://bryntum.com/products/grid/examples/nested-grid/) its calculating parent row field as on change in child row.
Sample code is here
Hi!
The RowExpander listens to the expanded Grid's store for changes, and redraws the expanded row. But that only works for one level of nesting, and you have two.
I've created a ticket to fix this (I was actually working on it when you posted this): https://github.com/bryntum/support/issues/8671
Workaround (sorry for bad typings):
// Ordergrid.tsx
rowExpander: {
refreshOnRecordChange: false,
column: {
renderer: (data: any) => {
data.cellElement.classList.add('hide');
},
},
// enableAnimations: false,
dataField: 'deliveryRows',
renderer: (event: any) => {
return InvoiceGrid({
record: event.record,
amountRenderer: amountRenderer
});
},
listeners : {
expand(data : any){
const salesOrderGrid = (this as any).client.owner;
data.widget.store.on({
update(){
salesOrderGrid.refreshRows();
}
});
}
}
}
Regards
Joakim