Results 1 to 2 of 2

Thread: Drag And Drop Not Working - Help quick!

  1. #1

    Default Drag And Drop Not Working - Help quick!

    I need to use drag and drop and when I click my row to begin the drag an error is thrown in the getDragData function. This is the original function, not overridden. The code to create my grid is below. That is from my ui file. Any ideas are appreciated. I didn't see isSelected as a method belonging to the selModel, but maybe I am missing it. I have very similar logic working for other grids so I assume the ext js framework is not the issue. Any ideas are appreciated!

        getDragData : function(e){
            var t = Ext.lib.Event.getTarget(e);
            var rowIndex = this.view.findRowIndex(t);
            if(rowIndex !== false){
                var sm = this.grid.selModel;
                if(!sm.isSelected(rowIndex) || e.hasModifier()){//blows up here, isSelected is not a defiend //method
                    sm.handleMouseDown(this.grid, rowIndex, e);
                return {grid: this.grid, ddel: this.ddel, rowIndex: rowIndex, selections:sm.getSelections()};
            return false;

    CMA.PartyAddressGridUi = Ext.extend(Ext.grid.EditorGridPanel, {
        frame: true,
        loadMask: true,
        stripeRows: true,
        header: true,
        enableColumnHide: false,
        enableColumnMove: false,
        enableDragDrop: true,
        ddGroup: 'addressDDGroup',
        initComponent: function() {
            this.columns = [
                    width: 115,
                    xtype: 'cmaAddressTypeColumn'
                    id: 'addressGridAddressColumn',
                    xtype: 'cmaAddressColumn'
                    width: 65,
                    xtype: 'cmaEffectiveDateColumn'
                    width: 65,
                    xtype: 'cmaAddressValidFromColumn'
                    width: 55,
                    xtype: 'cmaAddressValidToColumn'
            this.tbar = {
                xtype: 'toolbar',
                height: 23,
                items: [
                        xtype: 'tbtext',
                        text: 'Addresses'
                        xtype: 'tbseparator'
                        xtype: 'button',
                        text: 'Add',
                        iconCls: 'icon-plus',
                        ref: '../addButton'
            this.view = new Ext.grid.GridView({
                forceFit: true,
                deferEmptyText: false,
                emptyText: '<div class="cma-error">Residence Address Required.</div>'

  2. #2


    I just got it. I am not sure what the exact cause of this issue was, but I believe it has something to do with the fact that I was adding in these columns in my initComponent function. I suspect it ahs something to do with the check column but I am not sure. In any case to fix the error I added these two lines into my afterRender function. Maybe this will help someone else down the road.

    the selModel was missing methods so I recreated it, once it was recreated some of its functions were looking for a reference to the grid, so I added the reference int he second line
            	this.selModel = new Ext.grid.RowSelectionModel();
            	this.selModel.grid = this;
            this.getColumnModel().config.push(new Ext.ux.grid.CheckColumn({
                securityEnable: true,
                id: 'lastKnownColumn',
                dataIndex: CMA.LAST_KNOW_KEY,
                header: 'Last Known',
                editable: true,
                width: 70,
                fixed: true
            //Shortening of effective date header to allow room for last know column.
                if (col instanceof CMA.EffectiveDateColumn) {
                    col.header = 'Eff. Date';
            }, this);
            //action column pushed into column model added with deletion and edit icons 
            this.getColumnModel().config.push(new Ext.grid.ActionColumn({
                id: 'actionColumn',
                securityEnable: true,
                scope: this,
                items: [{
                    iconCls: 'icon-edit-record',
                    tooltip: 'Edit',
                    handler: this.showEditView
                }, {
                    xtype: 'spacer',
                    width: 25
                }, {
                    iconCls: 'icon-minus',
                    tooltip: 'Delete',
                    handler: function(grid, rowIndex, colIndex, item, event){
                width: 65,
                fixed: true

Posting Permissions

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