[英]extjs 4.2.1 GridPanel - Show/Hide link in template column
I have a template column in my gridpanel
containing a URL: 我的gridpanel
中有一个包含URL的模板列:
{
xtype: 'templatecolumn',
tpl: Ext.create('Ext.XTemplate',
'<a href="#" class="x-leave-request-edit">Edit</a>'
)
}
When a user mouses over a particular row in the gridpanel
, I want the link to be visible: 当用户将鼠标悬停在gridpanel
的特定行上时,我希望链接可见:
listeners: {
'itemmouseenter': function(gridpanel, record, item) {
var editLink = Ext.select(Ext.query('a.x-leave-request-edit', item, 'select', true));
editLink.setVisible(true);
},
'itemmouseleave': function(gridpanel, record, item) {
var editLink = Ext.select(Ext.query('a.x-leave-request-edit', item, 'select', true));
editLink.setVisible(false);
}
}
This works fine. 这很好。 The problem though is that by default, I want the links in the tpl
to be invisible. 问题是默认情况下,我希望tpl
的链接不可见。
How can I achieve this? 我该如何实现?
I tried using similar code as above in onRender()
, afterRender()
and finishRender()
but the Ext.query()
always returns an empty array. 我尝试在onRender()
, afterRender()
和finishRender()
使用与上面类似的代码,但是Ext.query()
总是返回一个空数组。
Instead of all that query
ugliness, you can just use: 除了使用所有query
丑陋的方法,您可以使用:
item.down('.x-leave-request-edit')
. item.down('.x-leave-request-edit')
。
To make it not visible the initially, just add display: none;
要使其最初不可见,只需添加display: none;
in the inline style. 内联样式。
return '<a href="#" style="display: none;" class="x-leave-request-edit">Edit</a>';
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.