ExtJs 按钮 - 在点击侦听器上更改文本和 cls
ExtJs button - change text and cls on click listener
我有一个 extjs 3.4 按钮,它的作用类似于切换按钮,请参见下面的代码:
this.advanceFilterToggleBtn = {
xtype: 'button',
id: 'advancedSearchLink',
text: 'More Filter Options',
iconCls: 'button-more-filter-options',
width: '150',
listeners: {
click: function(btn, el){
// do stuff
if(this.text === 'More Filter Options'){
// do some more stuff
this.text = 'Less Filter Options';
this.iconCls = 'button-less-filter-options';
}else {
this.text = 'More Filter Options';
this.iconCls = 'button-more-filter-options';
}
}
}
按钮上的文本和 class 发生了变化 我可以确认,但显示没有更新。这意味着它仍然显示相同的初始文本和向下的人字形。我在 chrome 开发工具中有断点,并且 if 和 else 块都被命中。
我尝试使用通过点击侦听器传递的 btn 对象的 setText 和 setIconCls,而不是使用 'this',但它不起作用。在这种情况下,else 块不会被命中。
我尝试在 if 和 else 块的开头移动 this.text 和 this.iconCls,但没有成功。
感谢任何帮助。
谢谢
if(btn.getText() === 'More Filter Options'){
advForm.expand(true);
filterPanel.setHeight(220);
srTab.doLayout();
btn.setText('Less Filter Options');
btn.setIconCls('button-less-filter-options');
} else {
advForm.collapse();
filterPanel.setHeight(130);
srTab.doLayout();
btn.setText('More Filter Options');
btn.setIconCls('button-more-filter-options');
}
我有一个 extjs 3.4 按钮,它的作用类似于切换按钮,请参见下面的代码:
this.advanceFilterToggleBtn = {
xtype: 'button',
id: 'advancedSearchLink',
text: 'More Filter Options',
iconCls: 'button-more-filter-options',
width: '150',
listeners: {
click: function(btn, el){
// do stuff
if(this.text === 'More Filter Options'){
// do some more stuff
this.text = 'Less Filter Options';
this.iconCls = 'button-less-filter-options';
}else {
this.text = 'More Filter Options';
this.iconCls = 'button-more-filter-options';
}
}
}
按钮上的文本和 class 发生了变化 我可以确认,但显示没有更新。这意味着它仍然显示相同的初始文本和向下的人字形。我在 chrome 开发工具中有断点,并且 if 和 else 块都被命中。
我尝试使用通过点击侦听器传递的 btn 对象的 setText 和 setIconCls,而不是使用 'this',但它不起作用。在这种情况下,else 块不会被命中。
我尝试在 if 和 else 块的开头移动 this.text 和 this.iconCls,但没有成功。
感谢任何帮助。
谢谢
if(btn.getText() === 'More Filter Options'){
advForm.expand(true);
filterPanel.setHeight(220);
srTab.doLayout();
btn.setText('Less Filter Options');
btn.setIconCls('button-less-filter-options');
} else {
advForm.collapse();
filterPanel.setHeight(130);
srTab.doLayout();
btn.setText('More Filter Options');
btn.setIconCls('button-more-filter-options');
}