2015-01-13 272 views
0

我是新与煎茶触摸和我有以下方法:显示/隐藏按钮2

toggleProfitability: function (button) { 
     var tspStatus = Ext.ComponentQuery.query('#tspstatus'); 
     var vbsStatus = Ext.ComponentQuery.query('#vbsstatus'); 
     if (tspStatus.length && vbsStatus.length > 0) { 
      Ext.each(tspStatus, function (item) { 
       Ext.fly(item.id).hide(); 
      }); 
      Ext.each(vbsStatus, function (item) { 
       Ext.fly(item.id).hide(); 
      }); 
     } 
     // close Menu 
     button.up('cartMenuPanel').hide(); 
    }, 

在上面,我是拨打电话到hide方法的代码的底部,但我事后不确定如何再次显示隐藏的字段,任何人都可以提出一种方法来做到这一点?

感谢您的帮助!

回答

0

我找到了解决办法,现在it's工作...

toggleProfitability: function (button) { 
    var listItems = Ext.ComponentQuery.query('cartItems cartItem'); 
    Ext.each(listItems, function (item) { 
     var tsp = item.down('[name=tspstatus]'); 
     var vbs = item.down('[name=vbsstatus]'); 
     tsp.setHidden(!vbs.getHidden()); 
     vbs.setHidden(!vbs.getHidden()); 

    }, this); 
    // close Menu 
    button.up('cartMenuPanel').hide(); 
},  

谢谢!

0

你应该能够检查项目的可见性状态并切换它们在你的按钮处理程序可视性定义它:

{ 
    xtype: 'button', 
    handler: function() { 
     var tspStatus = Ext.ComponentQuery.query('#tspstatus')[0]; 
     var vbsStatus = Ext.ComponentQuery.query('#vbsstatus')[0]; 

     if (tspStatus.isVisible() && vbsStatus.isVisible()) { 
      tspStatus.hide(); 
      vbsStatus.hide(); 
     } else { 
      tspStatus.show(); 
      vbsStatus.show(); 
     } 
    }, 
    text: 'Show/Hide' 
} 

为下文commnets发现罗布,如果你所期望的ComponentQuery的结果返回多个组件,您需要使用类似于Ext.each的结果遍历结果,并在这些行的末尾删除[0]

+0

对不起,但它不适用于我,您可以在下一条评论中看到我的解释.. – inane

+0

是的,因为@rob已经说过我们看不到代码的隐藏项目。你究竟想要达到什么目标?如果您的代码显示所有特定于此问题的代码并解释您所需的内容,那么帮助解决此问题将更容易。或者甚至更好地创建一个[Fiddle](http://fiddle.sencha.com)复制问题 – Scriptable

+0

简单地说,我想隐藏“vbsStatus”和“tspStatus”从一个按钮,并在下次显示...隐藏/显示每次。感谢您的帮助 – inane

0

你无法做任何事情的原因是因为你实际上隐藏了初学者按钮的父容器。

如果你可以把你的按钮放在不同的地方,那么你可以在每次点击按钮时应用逻辑。

Ext.application({ 
    name: 'Fiddle', 

    launch: function() { 

     Ext.create('Ext.Panel', { 
      fullscreen: true, 
      renderTo: Ext.getBody(), 
      items: [{ 
       xtype: 'panel', 
       title: 'Test Panel', 
       html: 'Some html here', 
       items: [{ 
        xtype: 'toolbar', 
        docked: 'top', 
        title: 'My Toolbar' 
       }] 
      }, { 
       xtype: 'button', 
       handler: this.toggleProfitability, 
       text: 'Toggle Panel' 
      }] 
     }) 

    }, 

    toggleProfitability: function(button) { 
     /*var tspStatus = Ext.ComponentQuery.query('#tspstatus'); 
     var vbsStatus = Ext.ComponentQuery.query('#vbsstatus'); 
     if (tspStatus.length && vbsStatus.length > 0) { 
      Ext.each(tspStatus, function(item) { 
       Ext.fly(item.id).hide(); 
      }); 
      Ext.each(vbsStatus, function(item) { 
       Ext.fly(item.id).hide(); 
      }); 
     } 
     // close Menu 
     button.up('cartMenuPanel').hide();*/ 

     // First get the target 
     var myTarget = button.up('panel').child('panel'); 

     // Now set hidden as the opposite value of `hidden` 
     myTarget.setHidden(!myTarget.getHidden()); 
    } 
}); 

演示:https://fiddle.sencha.com/#fiddle/gbh

+0

它不适用于我,在我的代码中我应该隐藏“vbStatus”和“tspStatus”当我发送一个事件时,触发toggleProfitability方法 – inane

+0

@inane你是问题代码当然不显示你刚刚评论的内容,但在这种情况下,看看我的评论以上关于@ Scriptable的答案。我的代码是你如何切换元素/组件的可见性的例子。 –