How to call a function from tpl in ExtJs

526 Views Asked by At

I am using dataview control where I need to call a function from its tpl. Below is my code but its not working.

                                        xtype: 'dataview',
                                        scrollable: true,
                                        tpl: new Ext.XTemplate(
                                            '<tpl for=".">',
                                            '<div class="messageTbl">',
                                            '<table style="width: 100%;">',                                             
                                            '<tr><td>{[this.formatDate(CreationDate)]}</td><tr/>',                                              
                                            '</table>',
                                            '</div>',
                                            '</tpl>',
                                            { 
                                                formatDate: function (date) {
                                                    return date;
                                                    }
                                                },
                                            }
                                        ),
2

There are 2 best solutions below

2
On

You have syntax error in formatDate function.

{
    xtype: 'dataview',
    scrollable: true,
    tpl: new Ext.XTemplate(
        '<tpl for=".">',
        '<div class="messageTbl">',
        '<table style="width: 100%;">',
        '<tr><td>{[this.formatDate(CreationDate)]}</td><tr/>',
        '</table>',
        '</div>',
        '</tpl>',
        {
            formatDate: function (date) {
                return date;
            }
        }
    )
}
0
On

Asking for index in same example:

This is in the summary section of the XTemplate documenation?

XTemplate Documentation

var tpl = new Ext.XTemplate(
    '<p>Kids: ',
    '<tpl for=".">',       // process the data.kids node
        '<p>{#}. {name}</p>',  // use current array index to autonumber
    '</tpl></p>'
);
tpl.overwrite(panel.body, data.kids); // pass the kids property of the data object