开发者

In ExtJS, How to inject enableKeyEvents = true in component?

开发者 https://www.devze.com 2023-03-03 23:21 出处:网络
This is my code, myText.enableKeyEvents = true; // ** myText.on(\'keyup\', function(t){ console.log(t.getValue()); });

This is my code,

myText.enableKeyEvents = true; // **
myText.on('keyup', function(t){ console.log(t.getValue()); });

It not work, I think it may has some invoke method.

Any one has an idea ?


Full code

// function
var txfJump = function(txf){
    var next = txf.nextSibling();
    if(next.xtype == 'textfield'){
        txf.enableKeyEvents = true;
        txf.on('keyup', function开发者_Go百科(t, e){
            if(t.getValue().length == t.maxLength){
                next.focus();
            }
        });
        txfJump(next);
    }
};
// form
var p = new Ext.Panel({
    title   : 'test panel',
    width   : 400,
    defaults: {
        xtype : 'textfield',
    },
    items   : [
        { ref : 'one',  maxLength : 5 },
        { ref : 'two',  maxLength : 5 },
        { ref : 'three',maxLength : 5 },
        {
            xtype   : 'button',
            text    : 'SAMPLE'
        },
        { ref : 'four', maxLength : 5 },
    ],
    renderTo: Ext.getBody()
});

Ext.onReady(function(){
    txfJump(p.one);
});


It's not possible without hackish tricks. Having read the TextField's source, i found out, that there is a private method initEvents, that sets up the callbacks for the html-elements if and only if enableKeyEvents is set. So, changing enableKeyEvents after initEvents was called has no effect, until it is called again.

To inject it, one could try to trigger a re-rendering of the component, or one could copy the behaviour of the relevant parts of TextField's initEvent. But there doesn't seem to be an official way.


you have to call txf.initEvents(), this needs to be called after txf.enableKeyEvents = true;

var txfJump = function(txf){
var next = txf.nextSibling();
if(next.xtype == 'textfield'){
    txf.enableKeyEvents = true;
    txf.initEvents();            //<----- this is what you have missing
    txf.on('keyup', function(t, e){
        if(t.getValue().length == t.maxLength){
            next.focus();
        }
    });
    txfJump(next);
}


You should pass "enableKeyEvents": true when getting new Ext.form.TextField instance. Here is the example usage

var textField = new Ext.form.TextField({
    . // your configs
    .
    enableKeyEvents: true,
    .
    .
})
0

精彩评论

暂无评论...
验证码 换一张
取 消