Comment déclencher un événement avec ExtJS sur tous les éléments HTML d'une classe donnée

Question

Je veux simuler un clic avec la souris sur tous les éléments d'une classe donnée ("x-grid3-col-value"). Je n'ai pas réussi à le faire avec ExtJS car la fonction "fireEvent" ne s'applique qu'aux composants ExtJS. Comment pourrais-je faire?

Answer 1

Je l'ai utilisé cet extrait, ce qui est assez laid, mais fonctionne.

function getElementsByClassName(classname, node) { 
    if (!node) { 
     node = document.getElementsByTagName('body')[0]; 
    } 
    var a = [], re = new RegExp('\\b' + classname + '\\b'); 
    els = node.getElementsByTagName('*'); 
    for (var i = 0, j = els.length; i < j; i++) { 
     if (re.test(els[i].className)) { 
      a.push(els[i]); 
     } 
    } 
    return a; 
} 

HTMLElement.prototype.click = function() { 
    var evt = this.ownerDocument.createEvent('MouseEvents'); 
    evt.initMouseEvent('click', true, true, this.ownerDocument.defaultView, 1, 
      0, 0, 0, 0, false, false, false, false, 0, null); 
    this.dispatchEvent(evt); 
} 

var elts = getElementsByClassName("x-grid3-col-value", window.innerHTML); 
var i = 0; 

while (i < elts.length) { 
    var elt = elts[i]; 
    elt.click(); 
    i++; 
} 

Answer 2

Vous obtiendrez tous les articles avec cette classe ainsi:

var items = Ext.query('.x-grid3-col-value'); 

Il vous donnera un tableau de tous les éléments. Ensuite, vous pouvez aller par chaque élément et placez un gestionnaire sur chaque élément:

Ext.each(items, function (item) { 
     item = Ext.get(item); 

     item.on('click', function() { 
      //'click' or 'dblclick' or 'mouseover' 
      //console.log(item); 
      //Do whatever you want 
     }, this); 
    }, this);