Nested mesh not generated in Ext JS 6.2

Question

Hi Techies , I created a nested grid in Ext JS 6.2 using the "Rowwidget" plugin. However, I got an external mesh. But the inner grid is not shown.

I followed this Sencha Code Example

My code is available in:    Sencha Fiddle

Thanks in advance...

Answer 1

According to Sencha documentation: http://docs.sencha.com/extjs/6.2.1/classic/Ext.data.schema.Association.html#ext-data-schema-association_association-concepts

In this case, the link properties should be as follows:

• type: name of the parent model
• inverse: , - ( , , )

Model:

var orderMDL = Ext.define('orderModel', {
extend: 'Ext.data.Model',

fields: [
// Declare an association with Company.
// Each Company record will be decorated with
// an "orders" method which yields a store
// containing associated orders.
{
    name: 'companyId',
    reference: {
        type:'companyModel',
        inverse:'orders'
    }
}, {
    name: 'productCode'
}, {
    name: 'quantity',
    type: 'number'
}, {
    name: 'date',
    type: 'date',
    dateFormat: 'Y-m-d'
}, {
    name: 'shipped',
    type: 'boolean'
}],

proxy: {
    type: 'memory',
    data: ordersListJSONArray
}});

:

widget: {
            xtype: 'grid',
            autoLoad: true,
            bind: {
                store: '{record.orders}',
                title: 'Orders for {record.name}'
            },
            columns: [{
                text: 'Order Id',
                dataIndex: 'id',
                width: 75
            }, {
                text: 'Procuct code',
                dataIndex: 'productCode',
                width: 265
            }, {
                text: 'Quantity',
                dataIndex: 'quantity',
                width: 100,
                align: 'right'
            }, {
                format: 'Y-m-d',
                width: 120,
                text: 'Date',
                dataIndex: 'date'
            }, {
                text: 'Shipped',
                dataIndex: 'shipped',
                width: 75
            }]
        }