PDA

View Full Version : trying to add up and down arrow listeners to divs created from a store



tnweb
14 Jul 2014, 12:32 PM
Thanks for your patience in advance, as I am new to Ext Js. I'm trying to add up and down arrow listeners to divs created from a store.

Upon loading my store, I am trying to create a new div element with a keyup listener that runs a function.

I am receiving this error "Cannot read property 'createRange' of undefined from this code in ext.all.js:
F = y.ownerDocument.createRange();

When debugging, I see y.ownerDocument exists but is missing the createRange method. So, I am not feeding something properly.

my code inside the onStoreLoad() is:

function handleKeyUp(e) {
var code = e.keyCode ? e.keyCode : e.which;
if (code === 38) { //up key
alert('up');
} else if (code === 40) { //down key
alert('down');
}
}
var tileDiv = new Ext.Element({
tag: 'div',
id: tileId,
cls: 'tile',
html: html,
listeners: {
keyup: handleKeyUp,
scope: this
}
});
Ext.DomHelper.insertHtml('beforeEnd', this.el, tileDiv);

this.el is my div container element

tnweb
14 Jul 2014, 6:33 PM
I've solved the createRange error with this edit:

Ext.DomHelper.insertHtml('beforeEnd', this.el.dom, tileDiv);

[object Object] is now displaying in the browser, so I need to transform the tileDiv object into a consumable html element prior to inserting it into the DomHelper...

tnweb
15 Jul 2014, 7:56 AM
I was incorrectly using the DomHelper... Switching to Ext.DomHelper.append() worked.

Ext.DomHelper.append(this.el.dom,
{
tag: 'div',
id: tileId,
cls: 'tile',
html: html
});