ExtJS 4 GridPanel - RowBody

For everyone who is looking for similar functionality with rowbody like in ExtJS 3 just read this short article.

In short - bad documentation created by Sencha. When you take a look at current version of ExtJS 4.2.2 you will find following code:

features: [{
    ftype: 'rowbody',
    setupRowData: function(record, rowIndex, rowValues) {
        var headerCt = this.view.headerCt,
            colspan = headerCt.getColumnCount();
        // Usually you would style the my-body-class in CSS file
        return {
            rowBody: '<div style="padding: 1em">'+record.get("desc")+'</div>',
            rowBodyCls: "my-body-class",
            rowBodyColspan: colspan

After searching in source code of Ext.grid.feature.RowBody you will find followings:

 * @method getAdditionalData
 * Provides additional data to the prepareData call within the grid view.
 * The rowbody feature adds 3 additional variables into the grid view's template.
 * These are rowBodyCls, rowBodyColspan, and rowBody.
 * @param {Object} data The data for this particular record.
 * @param {Number} idx The row index for this record.
 * @param {Ext.data.Model} record The record instance
 * @param {Object} orig The original result from the prepareData call to massage.
setupRowData: function(record, rowIndex, rowValues) {
    if (this.getAdditionalData) {
        Ext.apply(rowValues, this.getAdditionalData(record.data, rowIndex, record, rowValues));

which is what we are looking for. As you see, instead of using setupRowData, you will simply use getAdditionalData function and everything works well as expected.

me.features = [
        ftype: 'rowbody',
        getAdditionalData: function (data, rowIndex, record, rowValues) {
            return {
                rowBody: Ext.String.format('{0}', record.get("comments")),
                rowBodyCls: this.rowBodyCls,
                rowBodyColspan: this.view.headerCt.getColumnCount()