PDA

View Full Version : function calls from within template generated html



eyepoker
14 Sep 2011, 4:23 PM
I need to call a function via html generated from within a template. it doesn't work and for the moment I'm at a loss as to how to get this working, though i suspect a scoping issue... . Any ideas?



function someFunction(num){
console.log('someFunction fired, num = ' + num);
}

var tipTpl = new Ext.XTemplate(
'<tpl for=".">',
'<div class="postWrapper">',
'<div class="postContentWrapper">',
'<div class="postTopRowLeft">',
'{post_creation_date}<br>',
'<div class="postUserName">{post_creator_name} ({post_contributions})</div>',
'</div>',
'<div class="postTopRowRight">',
'Facebook <a href="javascript:someFunction({post_id});">Fave</a>',
'</div>',
'<div class="clearFloat"></div>',
'<div class="postMiddleRow">',
'{post_text}',
'</div>',
'</div>',
'<div class="postBottomRow">',
'<div class="bubbleTail">x</div>',
'<div class="postBottomRowLeft">Comments ({post_replies})</div>',
'<div class="postBottomRowMiddle">Likes ({post_likes})</div>',
'<div class="postBottomRowRight">Report Abuse</div>',
'<div class="clearFloat"></div>',
'</div>',
'</div>',
'</tpl>',
{compiled:true}
);

eyepoker
15 Sep 2011, 8:09 AM
i figured it out. though i'd like to get thoughts from others on the topic if possible.

the following will work:




var someFunction;

Ext.setup({
onReady: function(){

someFunction = function(num){
console.log('someFunction fired, num = ' + num);
}

var tipTpl = new Ext.XTemplate(
'<tpl for=".">',
'<div class="postWrapper">',
'<div class="postContentWrapper">',
'<div class="postTopRowLeft">',
'{post_creation_date}<br>',
'<div class="postUserName">{post_creator_name} ({post_contributions})</div>',
'</div>',
'<div class="postTopRowRight">',
'Facebook <a href="javascript:someFunction({post_id});">Fave</a>',
'</div>',
'<div class="clearFloat"></div>',
'<div class="postMiddleRow">',
'{post_text}',
'</div>',
'</div>',
'<div class="postBottomRow">',
'<div class="bubbleTail">x</div>',
'<div class="postBottomRowLeft">Comments ({post_replies})</div>',
'<div class="postBottomRowMiddle">Likes ({post_likes})</div>',
'<div class="postBottomRowRight">Report Abuse</div>',
'<div class="clearFloat"></div>',
'</div>',
'</div>',
'</tpl>',
{compiled:true}
);

}});

mw-flow
15 Sep 2011, 8:36 AM
Maybe you'll get more attention for this topic when posting this to the "Open Discussion" board. This board is about events, meetups and other general topics of interest to the Sencha Community.

Have fun & best regards
Markus

eyepoker
15 Sep 2011, 11:19 AM
didn't realize i was in the wrong forum... feel free to move the thread!

mberrie
17 Sep 2011, 10:02 AM
You could register a DOM event click listener in the 'onRender' callback of the Ext component that renders the XTemplate, or in an 'afterRender' listener.