PDA

View Full Version : [Q] How to call function from rowExpander template



cjessing
12 Nov 2014, 1:48 AM
Hi all

ExtJS 4.2.2

I'm using the Ext.grid.plugin.RowExpander plugin to render a list of approvers. I would like to call a function to format the list and below is my feeble attempt to do this. Needless to say it doesn't work and the debug statement I'm expecting is not printed :-(

Can anyone point me in the right direction to accomplish this?

Here's the snippet:


plugins: [
{
ptype: 'rowexpander',
// rowBodyTpl: [ '<p><strong>Approver(s):</strong><br/>{approvers}</p>' ],
rowBodyTpl: new Ext.XTemplate(
'<p><strong>Approver(s):</strong><br/>[{this.formatApprovers(approvers)}]</p>',
{
formatApprovers: function (approvers) {
Ext.log('formatApprovers');
debugger;
}
}
),
expandOnDblClick: false
}
]

cjessing
13 Nov 2014, 2:41 AM
Got it:



plugins: [
{
ptype: 'rowexpander',
rowBodyTpl: new Ext.XTemplate(
'<p><strong>One of the following needs to approve this request:</strong><br/>{[this.formatApprovers(values.approvers)]}</p>',
{
formatApprovers: function (approvers) {
var me = this,
approverList = approvers.split(';'),
approversLi = '';

Ext.Array.each(approverList, function (approver) {
if (approver.length > 0) {
approversLi += "<li>" + me.toTitleCase(approver) + "</li>";
}
});

return approversLi.length > 0
? '<ul>' + approversLi + '</ul>'
: 'N/A';
},
toTitleCase: function (str) {
return str.replace(/\w\S*/g, function (txt) {
return txt.charAt(0).toUpperCase() + txt.substr(1).toLowerCase();
});
}
}
),
expandOnDblClick: false
}
],