单击页面中的任意位置时隐藏DateField

时间:2014-12-17 14:33:42

标签: extjs extjs4 extjs4.1

我试图在点击除日期字段之外的DOM上的任何位置时隐藏extjs日期字段。当点击dom bodyClick函数中的任何地方时,调用。在页面坐标的基础上获取元素对象,然后将此元素对象与日期字段对象进行比较。这很好但每当我再次点击日期选择器时问题就出现了#34;日期字段"得到隐藏。

示例代码 -

  bodyClick: function(e){
       var me = this, elem, t;
      var flag =true;
        elem = me.getEl();
      for(t = Ext.dom.Element.fromPoint(e.getX(), e.getY()); t && t != null;){
        if (Ext.fly(elem ).contains(t)){
            flag =false;
        } 
       }

      if(flag ){
        me.hide();
      }
    }

enter image description here

在点击DOM(extJs)中的任何位置时隐藏日期字段的任何建议。

1 个答案:

答案 0 :(得分:4)

您可以在组件所在的面板或容器的afterRender中尝试此操作。

   this.mon(Ext.getBody().getEl(), 'click', this.yourFunction, this);

    yourFunction:function(e){
          var comp = Ext.ComponentQuery.query('datepicker')[0];//Get your datepicker component
          if (Ext.fly(e.getTarget()) != comp) {  //get the target using Ext.fly
                  comp.hide();              //Hide the component if the target is not the datepicker
              }

    }

希望这会对你有所帮助。