Results 1 to 2 of 2

Thread: Grid or Field in a window...but not both???

Hybrid View

Previous Post Previous Post   Next Post Next Post
  1. #1
    Sencha User
    Join Date
    Mar 2019
    Posts
    5

    Default Grid or Field in a window...but not both???

    This is driving me insane... I am making a popup window with a text entry field at the top, followed by a datagrid, then two buttons at the bottom to approve or cancel.

    The problem is that I can have the grid or the datafield appear, but not both... what am I doing wrong?

    Here's the code... if I comment out either of the two items in the items list (either the inline text field or the ref to grid) it will run, but including both will generate an error "Cannot set property 'component' of null" when the dialog window attempt to display.




    Code:
    Ext.define('MyApp.model.Mark', {
        extend: 'Ext.data.Model',
        fields: [{
            name: 'id',
            type: 'int'
    }, {
            name: 'annotation',
            type: 'string'
    }, {
            name: 'mark_date',
            type: 'date'
    }, {
            name: 'status',
            type: 'string'
    }]
    });
    
    Ext.define('MyApp.store.Marks', {
        extend: 'Ext.data.Store',
    
        //best to require the model if you  put it in separate files
    requires: ['MyApp.model.Mark'],
        model: 'MyApp.model.Mark',
        storeId: 'markStore',
        data: {
            items: [{
                id: 1,
                annotation: "Test",
                mark_date: "2013-04-24 9:28:00",
                status: "Done"
    }]
        },
        proxy: {
            type: 'memory',
            reader: {
                type: 'json',
                root: 'items'
    }
        }
    });
    
    var grid = Ext.create('Ext.grid.Panel', {
        itemId: 'markGrid',
        store: Ext.create('MyApp.store.Marks'),
        loadMask: true,
        width: 400,
        columns: [{
            header: 'annotation',
            dataIndex: 'annotation',
            width: 230,
            flex: 1
    }, {
            header: 'date',
            dataIndex: 'mark_date',
            width: 30,
            flex: 1
    }, {
            header: 'status',
            dataIndex: 'status',
            width: 30,
            flex: 1
    }]
    });
    
    
    Ext.define('csssui.view.batch.NewBatch', {
    
        extend: 'Ext.window.Window',
        xtype: 'newbatch',
    
        requires: [
            "csssui.view.batch.BatchSetupController",
            "csssui.view.batch.BatchModel",
            'Ext.form.Panel',
            'Ext.grid.Panel',
            'Ext.button.Button',
            'Ext.form.field.Text',
            'Ext.form.field.ComboBox'
    ],
    
    
        title: 'Batch',
        controller: "batchsetup",
        viewModel: {
            type: "batchsetup"
    },
        bodyPadding: 10,
        title: 'New Batch',
        closable: false,
    
        cls: 'plate',
        items: [
    
            // CHOOSE EITHER THIS:
            {
                xtype: 'textfield',
                name: 'batchId',
                fieldLabel: 'Batch ID:',
                allowBlank: false,
                enableKeyEvents: true
             },
    
             // OR THIS, BUT NOT BOTH!!!!
            // grid
    ],
    
    
        buttons:
            [
                {
                    text: 'Create',
                    listeners: {
                        click: 'onCreateDept'
                    }
                },
                {
                    text: 'Cancel',
                    listeners: {
                        click: 'onCancel'
                    }
                }
            ]
    })
    ;

  2. #2
    Sencha User
    Join Date
    Mar 2019
    Posts
    5

    Default

    I solved this...kinda... by putting the button code inside the tbar:{} property of the grid. This still does not explain why the code above does NOT work (maybe its too complex to render without another cotainer as a wrapper?) but its good enough for me now.

Tags for this Thread

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •