View Full Version : call the function from the XTemplate

24 Oct 2013, 5:55 AM
I am a beginner to EXTJS.

I have tried the following code to execute the function within the XTemplate but that the function doesn't executed and also no error in console.

var itemTpl = new Ext.XTemplate([
'<div>A -{a}</div>',
'<div>B -{b}</div>',
'<div>{ [this.add(value.a,value.b)] }</div>',

{disableFormats: true,
add: function(c, d) {

return c+d;
var data = {
a: 10,
b: 20,


Ext.create('Ext.panel.Panel', {
title: 'XTemplate Example',
height: 400,
bodyPadding: 10,
tpl: itemTpl,
data: data,
renderTo: Ext.getBody()

thanks in advance

24 Oct 2013, 1:02 PM
You have two problems:

In your template, don't include a space in between the curly brace and square brackets. Whitespace within the square brackets is fine, however. (For example: "{[ this.add() ]}", not "{ [this.add()] }".)
You should access the data in your template using the variable "values", not "value" as you currently have it.

Here's a working fiddle (https://fiddle.sencha.com/#fiddle/15r), taken from your example with these issues fixed.

24 Oct 2013, 10:13 PM
Thank u burnnat :))