fireEvent('click') not working in IE11 - Extjs

Question

I am planning to trigger a click event programatically when user presses a spacebar key. I have been used fireEvent('click') it is working for chrome, but It is not working for IE-11. I also tried, dispatchEvent for IE but it is throwing an error: "element does not support method or property dispatchEvent". Please follow below code.

onCustomRender: function(thisEl, args){
    var fetchTrigger = thisEl.getTrigger('fetchID
    fetchTrigger.el.on('keydown',function(e,thisEl){
            if (e.keyCode === 32) {

                //fetchTrigger.el.fireEvent('click');  //this is working in chrome //not working in IE and did not throwing error.

                var evObj = document.createEvent('MouseEvents'); 
                evObj.initEvent('click', true, false); 
                fetchTrigger.el.dispatchEvent(evObj);
            }
      });
}

Please Help Thanks in Advance

Why? Just call the function you want to run directly. – Evan Trimboli Feb 08 '16 at 09:08 — Evan Trimboli, Feb 08 '16 at 09:08

score 0 · Answer 1 · answered Feb 08 '16 at 12:32

First of all you have syntax error in the code you provided... Calling the function directly is easiest (as Evan said) but if you want to keep the logic in the controller you can fire events. Else you need some ugly code to get the controller first, then call the method...

I don't like fireing events and attaching listeners on the 'Ext.dom.Element' if you don't have to. Just use your ext elements..

Here is what I would do:

onCustomRender: function(thisEl, args){
    var fetchTrigger = thisEl.getTrigger('fetchID');
    fetchTrigger.on('keydown',function(trigger, e){
        if (e.keyCode === 32) {
            trigger.fireEvent('click', trigger);  
        }
    });
}

Or even better, use the controller:

implement listeners

init: function () {
    this.control({
        '#fetchID': { //you can optimize the componentQuery
            keydown: this.onTriggerKeyDown,
            click: this.onTriggerClick
        }
    });

},

and methods like this:

onTriggerKeyDown: function(trigger, e){
    if (e.keyCode === 32) {
        this.onTriggerClick(trigger);
    }
},
onTriggerClick: function(trigger) {
    //do you thing!
}

fireEvent('click') not working in IE11 - Extjs

1 Answers1