我需要将窗口的普通标题部分更改为可编辑片刻。我尝试了以下方法,但似乎在几个方面失败了。有人可以建议我一个更好的方法吗?
var header = window.getHeader();
header.setTitle(''); // Get rid of the original for now
var field = Ext.create('Ext.form.field.Text', {
name: 'Title',
allowBlank: false,
cls: 'myInput',,
value: 'Meh, just some text for now',
listeners : {
el : {
delegate : 'input',
click : function() {
field.focus(false); // Focus but do not select the text
field.selectText(0,0); // The previous failed, try to deselect like this
}
}
}
});
header.insert(0, field); // First, before the tools (several buttons there)
我的问题如下:
如果没有侦听器部分,根本无法选择输入字段,所有发生的事情都是触发窗口的移动。使用侦听器实现虽然输入字段的内容由于某种原因仍然被选中(没有selectText从0到0)。此外,不可能使用鼠标来选择部分内容,因为拖动仍然适用于整个窗口,并且监听器实现的“单击”可能也会破坏该方法。使用鼠标单击也无法将光标移动到特定位置。
那么,如何才能真正实现替换窗口标题的可用html输入字段呢?
答案 0 :(得分:1)
我尝试了以下似乎有效的策略:当鼠标光标进入输入字段时,禁用窗口拖动和放大。掉落,并在它离开时恢复它。
以下是您的代码所能提供的内容:
var killDrag = true;
// Found this by looking into the code: window.dd is an Ext.util.ComponentDragger
// Someone had the good idea to comment that, in there...
window.dd.on({
// Ext.util.ComponentDragger has a beforedragstart event that can cancel the drag.
// Apparently no one had the good idea to mention this event in the API doc.
beforedragstart: function(dd, e) {
if (killDrag) {
return false;
}
}
});
var header = window.getHeader();
header.setTitle(''); // Get rid of the original for now
var field = Ext.create('Ext.form.field.Text', {
name: 'Title',
allowBlank: false,
cls: 'myInput',
value: 'Meh, just some text for now',
listeners : {
el : {
delegate : 'input',
mouseout: function() {
killDrag = false;
},
mouseenter: function() {
killDrag = true;
}
}
}
});
header.insert(0, field); // First, before the tools (several buttons there)