Extjs 3.4 चेकमार्क श्रोता चेककॉम

Question

पर काम नहीं कर रहा है मेरे चेक कॉलम के लिए चेकchange श्रोता काम नहीं कर रहा है। कोई विचार क्यों नहीं?

var checked = new Ext.grid.CheckColumn({ 
    header: 'Test', 
    dataIndex: 'condition', 
    renderer: function(v,p,record){ 
     var content = record.data['info'];  
     if(content == 'True'){ 
       p.css += ' x-grid3-check-col-td'; 
      return '<div class="x-grid3-check-col'+(v?'-on':'')+' x-grid3-cc-'+this.id+'"> </div>'; 
     } 

    },  
    listeners:{ 
     checkchange: function(column, recordIndex, checked){ 
       alert("checked"); 
     } 

    } 

}); 

Answer 1

ExtJS 3 में, चेककॉल प्लगइन वास्तव में ExtJS के चेकबॉक्स घटक का उपयोग नहीं करता है, इसलिए चेकबॉक्स ईवेंट उपलब्ध नहीं हैं। चेककॉलम केवल grid column है जो सेलबॉक्स को चेकबॉक्स की तरह स्टाइल करने के लिए एक कस्टम रेंडरर जोड़ा गया है।

डिफ़ॉल्ट रूप से, केवल घटनाओं आप सुन सकते हैं Ext.grid.Column की घटनाओं (click, contextmenu, dblclick, और mousedown) कर रहे हैं।

This answer to a similar question दिखाता है कि चेककॉलम को ओवरराइड कैसे करें और पहले चेकमार्क & चेकचेंज ईवेंट जोड़ें।

initComponent: function(){ 
    Ext.ux.grid.CheckColumn.superclass.initComponent.call(this); 

    this.addEvents(
    'checkchange' 
); 
}, 

फिर processEvent में ईवेंट सक्रिय:

processEvent : function(name, e, grid, rowIndex, colIndex){ 
    if (name == 'mousedown') { 
    var record = grid.store.getAt(rowIndex); 
    record.set(this.dataIndex, !record.data[this.dataIndex]); 

    // Fire checkchange event 
    this.fireEvent('checkchange', this, record.data[this.dataIndex]); 

    return false; // Cancel row selection. 
    } else { 
    return Ext.grid.ActionColumn.superclass.processEvent.apply(this, arguments); 
    } 
}, 

जिसके परिणामस्वरूप

Answer 2

Ext.ux.grid.CheckColumn में, यह इनिशियलाइज़ विधि है कि एक checkchange घटना रजिस्टर जोड़ने चेककॉलम घटक इस तरह दिखना चाहिए:

Ext.ns('Ext.ux.grid'); 

    Ext.ux.grid.CheckColumn = Ext.extend(Ext.grid.Column, { 
    // private 
    initComponent: function(){ 
     Ext.ux.grid.CheckColumn.superclass.initComponent.call(this); 

     this.addEvents(
     'checkchange' 
    ); 
    }, 

    processEvent : function(name, e, grid, rowIndex, colIndex){ 
     if (name == 'mousedown') { 
     var record = grid.store.getAt(rowIndex); 
     record.set(this.dataIndex, !record.data[this.dataIndex]); 

     this.fireEvent('checkchange', this, record.data[this.dataIndex]); 

     return false; // Cancel row selection. 
     } else { 
     return Ext.grid.ActionColumn.superclass.processEvent.apply(this, arguments); 
     } 
    }, 

    renderer : function(v, p, record){ 
     p.css += ' x-grid3-check-col-td'; 
     return String.format('<div class="x-grid3-check-col{0}">&#160;</div>', v ? '-on' : ''); 
    }, 

    // Deprecate use as a plugin. Remove in 4.0 
    init: Ext.emptyFn 
    }); 

    // register ptype. Deprecate. Remove in 4.0 
    Ext.preg('checkcolumn', Ext.ux.grid.CheckColumn); 

    // backwards compat. Remove in 4.0 
    Ext.grid.CheckColumn = Ext.ux.grid.CheckColumn; 

    // register Column xtype 
    Ext.grid.Column.types.checkcolumn = Ext.ux.grid.CheckColumn; 

Answer 3

सरल जवाब

चेक बॉक्स चेक या ExtJS में चेक बॉक्स 3 ग्रिड पर जब उपयोगकर्ता क्लिक अनचेक करें। इस संपत्ति का उपयोग ग्रिड में करें: =>columnPlugins: [1, 2], मुझे विश्वास है कि इस कोड का उपयोग आपके कोड में पूरी तरह से खराब है।

xtype:grid, 
columnPlugins: [1, 2],