1. #1
    Sencha User
    Join Date
    Jun 2010
    Location
    Buenos Aires, Argentina
    Posts
    213
    Vote Rating
    9
    ldonofrio will become famous soon enough

      0  

    Default ActionColumn override (hideIndex, actionclick event and more)

    ActionColumn override (hideIndex, actionclick event and more)


    This is an override of Ext.grid.column.Action (easy to convert to a Component)


    Features:
    • Supports hideIndex config option (saki stuff)
    • Tooltip disabled on hidden actions
    • actionclick event (with this you can catch events working with MVC - arguments: grid, store, record, action (iconCls)), event doesn't fire if the action is hidden (record.hideIndex is true)
    • draggable=false, hideable=false, menuDisabled=true, fixed=false by default
    • autoWidth config option
    JS
    PHP Code:
    Ext.override(Ext.grid.column.Action, {
     
    draggablefalse,
     
    hideablefalse,
     
    menuDisabledtrue,
     
    fixedtrue,
     
    hideIndexnull,
     
    hiddenClsExt.baseCSSPrefix 'action-col-img-noaction',
     
    autoWidthtrue,
     
    iconWidth22,
        
     
    constructor: function(config) {
      var 
    cfg Ext.apply({}, config),
       
    items cfg.items || [this];
                
      for (var 
    index 0index items.lengthindex++){
       var 
    item items[index];
       if (
    Ext.isDefined(item.hideIndex)) {
        var 
    cls item.iconCls || '';
        var 
    tip item.tooltip || '';
        
    delete item.iconCls;
        
    delete item.tooltip;
        
    Ext.apply(item, {
         
    getClass: function(vmetarecord) {
          var 
    v.match(/<img/g).length;
          if (!
    record.get(this.items[i].hideIndex)) {
           
    this.items[i].tooltip tip;
           return 
    cls;
          } else {
           
    this.items[i].tooltip '';
           return 
    this.hiddenCls;
          }
         }
        });
       }
      }
      
    cfg.itemCount items.length;
      
    this.callOverridden([cfg]);
     },
        
     
    initComponent: function(){
      if (
    this.autoWidth) {
       
    this.width = (this.iconWidth this.itemCount);
      }
      
    this.callOverridden();
      
    this.addEvents(
       
    'actionclick'
      
    );
     },
        
     
    processEvent: function(typeviewcellrecordIndexcellIndexe){
      if (
    type == 'click') {
       var 
    match e.getTarget().className.match(this.actionIdRe);
       if (
    match) {
        var 
    tmp Ext.String.trim(e.getTarget().className).split(' ');
        var 
    action tmp[tmp.length 1];
        if (
    action != '' && action != this.hiddenCls) {
         
    this.fireEvent('actionclick'view.ownerCtview.getStore(), view.getStore().getAt(recordIndex), action);
        }
       }
      }
      return 
    this.callOverridden(arguments);
     }
    }); 
    SASS
    PHP Code:
    .#{$prefix}action-col-cell {
     
    img {
      
    height16px;
      
    width16px;
      
    cursorpointer;
     }
    }
    .
    #{$prefix}action-col-img-noaction {
     
    cursor: default !important;

    Last edited by ldonofrio; 30 Jun 2011 at 1:06 PM. Reason: code ident