PDA

View Full Version : Call function from html element



kortovos
8 Oct 2010, 6:06 AM
I am trying to use Javascript image mapping, but now I have a question. How do you call a function within touch, from an html element?


(function() {
img = Ext.getBody() .createChild(
{
tag : 'img',
id : 'page5Image',
usemap: '#components',
name : 'page5Image',
src : 'resources/img/ubench/carDamage.jpg',
style : 'width: 504px; height: 360px;position: absolute; top:40px; left:300px;',
VISIBILITY : 1,
DSIPLAY : 2
});
Ext.getBody().createChild(
{
tag : 'map',
name : 'components',
children:[{
tag : 'area',
shape: 'rect',
coords : '0,0,200,200',
target : '_self',
onClick: 'exampleclick()'
}]
});

function exampleclick(){
alert('clicked');
}
})();

mikeyroy
8 Oct 2010, 8:28 AM
Add an event listener to it, something like this: Ext.get('page5Image').on('tap', this.doThis, this);

kortovos
10 Oct 2010, 10:35 PM
I have considered an event listener, but have trouble putting on on the 'rect' in my example. In the example the rect has an onClick, but this one only works when it is outside the 'touch' code. How do I call a function within the 'touch' code from onclick? Is there maybe a possibility to have an 'outside' function relay the function to a function within the 'touch' code?

evant
10 Oct 2010, 10:47 PM
Ext.get('myMap').on('click', function(e, t){
console.log(t);
}, null, {delegate: 'area'});

kortovos
10 Oct 2010, 11:26 PM
Thanks Evant for your quick response. Works like a charm.