2011-10-22 31 views
0

如何查找在列上具有組合框並且用於通過和ajax代理更新存儲/數據庫的網格面板中的行索引?我正在使用Ext.grid.plugin.CellEditing。這是我的代碼。感謝您的關注!查找網格面板中的行ID

Ext.Loader.setConfig({ 
    enabled: true 
}); 
Ext.Loader.setPath('Ext.ux', '/extjs4/examples/ux'); 
Ext.require([ 
    'Ext.layout.container.Fit', 
    'Ext.grid.*', 
    'Ext.data.*', 
    'Ext.util.*', 
    'Ext.panel.*', 
    'Ext.selection.CellModel', 
    'Ext.state.*', 
    'Ext.form.*', 
    'Ext.ux.CheckColumn' 
]); 
Ext.define('Ext.app.HirePlanGrid', { 
    extend: 'Ext.panel.Panel', 
    alias: 'widget.hirePlangrid' 
    ,hireplanstoreId: 'hireplanstore' 
,hiremonthstoreId: 'hiremonthstore' 
    ,renderMonth : function (value, p, record) { 
     var fkStore = Ext.getStore(this.up('hirePlangrid').hiremonthstoreId); 
     var rec = fkStore.findRecord("MONTH_ID", value); 
     //return rec.get("ABBREVIATED_MONTH"); 
    } 
    ,initComponent: function() { 
     this.editing = Ext.create('Ext.grid.plugin.CellEditing', { 
      clicksToEdit: 2 
     }); 

     var objMonthStore = Ext.getStore(this.hiremonthstoreId); 
     objMonthStore.load(); 

     var objStore = Ext.getStore(this.hireplanstoreId); 
     objStore.setProxy({ 
      type: 'ajax', 
      url: 'hireplan.cfc?method=getEmployees' 
     }); 

     objStore.load(); 
     var onDeleteClick = function(field, value, options) {  
      // var objPanel = this.down('gridpanel'); 
      var selection = Ext.getCmp('grid').getSelectionModel().getSelection(); 
      alert(selection); 
      // var selection = getView().getSelectionModel().getSelection()[r]; 
      if (value) { 
       alert(value); 
       objStore.remove(value); 
       objStore.sync(); 
      } 
     }; 
     var onUpdateClick = function(field, value, options) {   
      alert('field= ' + field + ' value= '+ value+ 'options= '+ options); 
      objStore.update(objStore.getAt(value)); 
      onSync(); 
     }; 
     Ext.apply(this, { 
      layout: 'fit', 
      width: 800, 
      //height: 1500, 
      items: [{ 
       xtype: 'grid', 
       id : 'gridgrid', 
       //height: 300, 
       store: objStore, 
       selModel: { selType: 'cellmodel' }, 
       selType : 'rowmodel', 
       plugins: [this.editing], 
       // plugins: [cellEditing], 
       columnLines: true, 
       viewConfig: {stripeRows: true}, 
       //loadMask: true, 
       disableSelection: true, 
       listeners: { 
        selectionchange: function(selModel, selected) { 
         var selection = Ext.getCmp('gridgrid').getSelectionModel().getSelection(); 
        } 
       }, 
       columns: [ 
        { header: 'rowid', hidden: true, dataIndex: 'ROWID'}, 
        { 
         header: 'Indicator', 
         id: 'chkcolumn', 
         xtype: 'checkcolumn', 
         dataIndex: 'CHK_COL', 
         editor: { 
          xtype: 'checkbox', 
          cls: 'x-grid-checkheader-editor' 
         }, 
         listeners : checkchange : function(column, recordIndex, checked) 
         { 
          alert('checked rindex= ' + recordIndex); 
          onDeleteClick(column, recordIndex, checked); 
          //or send a request      
         } 
        } 
       },     
       { 
        id: 'employeeid', 
        header: 'employeeid',      
        width: 80, 
        hidden: false, 
        sortable: true, 
        dataIndex: 'EMPLOYEEID', 
        flex: 1 
       }, 
       { 
        id: 'NATIONALIDNUMBER', 
        header: 'NATIONALIDNUMBER', 
        width: 80, 
        sortable: true, 
        dataIndex: 'NATIONALIDNUMBER', 
        flex: 1 
       }, 
       { 
        id: 'MARITALSTATUS', 
        header: 'MARITALSTATUS', 
        width: 80, 
        sortable: true,      
        dataIndex: 'MARITALSTATUS', 
        flex: 1 
       }, 
       { 
        id: 'PotentialforInsourcingKV', 
        header: 'Potential for Insourcing', 
        width: 30, 
        sortable: true,      
        dataIndex: 'POTENTIAL_FOR_INSOURCING', 
        flex: 1, 
        editor: { 
        id: 'thiscombo', 
        xtype: 'combobox', 
        typeAhead: true, 
        triggerAction: 'all', 
        selectOnTab: true, 
        store: [ 
         ['1', 'Yes'], 
         ['0', 'No'] 
        ], 
        lazyRender: true, 
        listClass: 'x-combo-list-small', 
        listeners: { 'select' : function(r){ 
        var selval = Ext.getCmp("thiscombo").getValue(); 
        //var recval = Ext.getCmp("grid").getValue(); 
        //var selection = getView().getSelectionModel().getSelection()[r] 
        alert(selval + ' ' + rowIdx); 
        // onUpdateClick(editor, rowIdx, value); 
       } 
      }, 
     } 
    }, 
    { 
     id: 'ABBREVIATED_MONTH', 
     header: 'ABBREVIATED_MONTH', 
     width: 80, 
     sortable: true, 
     dataIndex: 'ABBREVIATED_MONTH', 
     flex: 1, 
     renderer: this.renderMonth, 
     field: { 
      xtype: 'combobox', 
      store: Ext.getStore(this.hiremonthstoreId), 
      typeAhead: true, 
      lazyRender: true, 
      queryMode: 'local', 
      displayField: 'ABBREVIATED_MONTH', 
      valueField: 'MONTH_ID', 
      listClass: 'x-combo-list-small' 
     } 
    }, 
    { 
     id: 'SALARIEDFLAG', 
     header: 'SALARIEDFLAG', 
     width: 80, 
     sortable: true,      
     dataIndex: 'SALARIEDFLAG', 
     flex: 1 
    }], 
    features: [{ 
     ftype: 'rowbody' 
    }] 
}] 
}); 
this.callParent(arguments); 
//this.getSelectionModel().on('selectionchange', this.onSelectChange, this); 
}, //initComponent 
getSelectedRowIndex : function(){ 
    var r, s; 
    r = this.getView().getSelectionModel().getSelection(); 
    s = this.getStore(); 
    return s.indexOf(r[0]); 
}, 
onSelectChange: function(selModel, selections){ 
    this.down('#delete').setDisabled(selections.length === 0); 
}, 
onSync: function() { 
    objStore.sync(); 
}, 
viewConfig: {}, 
}); 
+1

也許分享你的代碼很好,所以我們可以爲你解答。無論如何,您總是可以將事件掛鉤添加到'CellEditing'的'edit'事件中。它在EventObject中具有'rowIdx'屬性。但所有這些都取決於你的代碼。這只是其中一種可能的選擇。 –

+0

嘗試格式化您的代碼時,我發現您的大括號不匹配。除了這行之外的其他錯誤:'listeners:checkchange:function(column,recordIndex,checked)'。請先清理你的代碼。 – suknic

+0

信不信由你,「聽衆:checkchange:function(column,recordIndex,checked)」實際上效果很好。我會看看我可以做什麼關於大括號...感謝您看它! – user997117

回答

0

我在另一篇文章中讀到什麼,我需要做的是添加偵聽this.cellediting並使用「beforeedit」事件找行索引,然後設置變量:

var rIdx = ''; 
    var cIdx = '';  
    this.cellEditing = Ext.create('Ext.grid.plugin.CellEditing', { 
      clicksToEdit: 1, 
    listeners: { 
    'beforeedit': function(e){ 
    var me = this; 
    var allowed = !!me.isEditAllowed; 
    if (!me.isEditAllowed) 
    Ext.Msg.confirm('confirm', 'Are you sure you want edit?', function(btn){ 
         if (btn !== 'yes') 
          return; 
         me.isEditAllowed = true; 
         me.startEditByPosition({ 
          row: e.rowIdx, 
          column: e.colIdx 
         });   
        }); 
       rIdx = e.rowIdx; 
       cIdx = e.colIdx; 
       alert('rIdx= ' + rIdx + ' cIdx = ' + cIdx); 
       return allowed; 
      }, 
      'edit': function(e){ 
       this.isEditAllowed = true; 
    } 
    } 
    });