Ext2.02的一些总结

最近公司产品需要搞个web聊天，ext写这类东西比较快捷方便，但是由于不想使用收费版本，所以采用2.02的免费版本，很多地方需要自己修正，以后会陆续把在实践中遇到的问题和技巧记录下来。

1、htmlEditor

（1）htmlEditor在弹出框后自动获取焦点，htmlEditor在弹出框中出现时，工具栏是灰色的，需要点击获得焦点和是工具栏激活。一般聊天时希望打开窗口就获得焦点，如果在extDialog.show();之后写focus之类的依旧是拿不到焦点，原因就是,ext的show事件是个延迟的事件，所以需要在show的回调函数中进行处理，如下：

extDialog.show(opener,function(){editor.updateToolbar();editor.deferFocus();});

注意红色字体，不要写成focus(),这个方法没有效果；因为源码里面写的也是deferFocus();

2、ext2.02关于颜色menu和datefield在IE8下显示宽度的修正

Ext.override(Ext.menu.Menu, {
    autoWidth: function() {
        this.width += "px";
    }
});

3、ext.element的滚动条事件的修正

Ext.override(Ext.Element, {
    scrollTo : function(side, value, animate){
     var side = side.toLowerCase();
        var prop;
     switch (side) {
      case "left":
       prop = "scrollLeft";
       break;
      case "right":
       prop = "scrollLeft";
       value = this.dom.scrollWidth - (value + this.dom.clientWidth);
       break;
      case "top":
       prop = "scrollTop";
       break;
      case "bottom":
       prop = "scrollTop";
       value = this.dom.scrollHeight - (value + this.dom.clientHeight);
       break;
     }
     if (value < 0) value = 0;
        if(!animate || !A){
            this.dom[prop] = value;
        }else{
            var to = prop == "scrollLeft" ? [value, this.dom.scrollTop] : [this.dom.scrollLeft, value];
            this.anim({scroll: {"to": to}}, this.preanim(arguments, 2), 'scroll');
        }
        return this;
    }
});

4、修复Ext.grid.CheckboxSelectionModel不能自动判断全选的bug

if (Ext.grid.CheckboxSelectionModel) {
 var interceptOnMouseDown = Ext.grid.CheckboxSelectionModel.prototype.onMouseDown.createInterceptor(
  function(e, t){
   this.on('rowdeselect', this.handleDeselect, this);
   this.on('rowselect', this.handleSelect, this);
  }
 );
 Ext.override(Ext.grid.CheckboxSelectionModel,{
  hd : null,
  onMouseDown : interceptOnMouseDown,
  handleSelect:function(){
   if(this.grid.store.getCount()!=this.selections.length)
    return;
   var hd = Ext.fly(this.grid.getView().innerHd).child('div.x-grid3-hd-checker');
   if(!hd.hasClass('x-grid3-hd-checker-on'))
    hd.addClass('x-grid3-hd-checker-on');
  },
     handleDeselect:function(){
      if( this.grid.store.getCount() != this.selections.length +1)
       return;
      var hd = Ext.fly(this.grid.getView().innerHd).child('div.x-grid3-hd-checker');
      if(hd.hasClass('x-grid3-hd-checker-on'))
       hd.removeClass('x-grid3-hd-checker-on');
     }
   });
}

5、使ext.textField的非空判断能够判断空格

Ext.apply(Ext.form.TextField.prototype, {
 validator : function(text) {
  if (this.allowBlank == false && Ext.util.Format.trim(text).length == 0) {
   return false;
  } else {
   return true;
  }
 }
});

6、给form.labelField添加设置文字的方法，ext2.02无此方法

Ext.apply(Ext.form.Label.prototype,{
 setText: function(t, encode){
        this.text = t;
        if(this.rendered){
            this.el.dom.innerHTML = encode !== false ? Ext.util.Format.htmlEncode(t) : t;
        }
        return this;
    }

});

7、给ext2.02添加两次密码输入验证的验证方法

 Ext.apply(Ext.form.VTypes, {
                password : function(val, field) {
                    if (field.initialPassField) {
                        var pwd = Ext.getCmp(field.initialPassField);
                        return (val == pwd.getValue());
                    }
                    return true;
                },
                passwordText : '两次输入的密码不一致!'
            });

注：initialPassField为第一次密码输入框的ID