How Can I add Dynamic Textboxes in extjs grid

Question

I am having a button on page on the click of the button i need to add rows inside extjs grid.

The row will contain the controls like textbox, combobox, datefields etc.

I have added dynamic rows to the store like this -

var r = Ext.create('Model', {
                name: 'XYZ',
                email: 'abc@abc.com',
                start: new Date(),
                salary: 50000,
                active: true
            });
            var i = 0;
            page.store.insert(i, r);

But this way i can add records only. and i want to add controls to the grid. Please suggest.

Thanks,

are those controls editors of the fields of the model you've added? Can you post your grid's code? — martskins, Mar 12 '14 at 13:29
have you checked out the [row](http://docs.sencha.com/extjs/4.2.2/#!/example/grid/row-editing.html) / [cell](http://docs.sencha.com/extjs/4.2.2/#!/example/build/KitchenSink/ext-theme-neptune/#cell-editing) editing examples on sencha docs — weeksdev, Mar 12 '14 at 14:03

score 0 · Answer 1 · answered Mar 13 '14 at 15:43

I have used the grid row editing plugin for the issue. Here i am adding the row to the store and opening it in edit mode via edit plugin. Sample code is here.

tbar: [
    {
        text: 'Add Row',
        iconCls: 'employee-add',
        handler: function () {
            //var Date = new Date();
            //var Time = new Date().getTime() / 1000;

            rowEditing.cancelEdit();

            // Create a model instance
            var r = Ext.create('TagAdjustment', {                    
                startDate: Ext.Date.clearTime(new Date()),
                startTime: 10,
                stopDate: Ext.Date.clearTime(new Date()),
                stopTime: 10,
                rampStart: 10,
                rampStop: 10,                
                gen: 10                   
            });

            var selectedRecord = grid.getSelectionModel().getSelection()[0];
            var row = grid.store.indexOf(selectedRecord);

            store.insert(row + 1, r);
            rowEditing.startEdit(row + 1, 0);
        }
    },

How Can I add Dynamic Textboxes in extjs grid

1 Answers1