[CLOSED] GridView GetRowClass and RowExpander conflict?

[Ben]

I have a grid that has uses GetRowClass in a GridView to set the CSS class on a row. I've since added a RowExpander and the GetRowClass function now never gets called. If I remove the RowExpander GetRowClass starts working again.

Is there a way to resolve this?

Regards,
Ben

[Vladimir]

Hi,

You cannot use RowExpander and GetRowClass at one time because RowExpander defines own GetRowClass function which will override grid's GetRowClass function (otherwise you can get a conflict)

[Ben]

Thanks. Is it possible to override this? I've had a look, would createSequence or createInterceptor help?

Something like:

function newFunctionName()
{
    // Some logic
    return "some-css-class-name";
}

var gridView = grid.getView();


gridView.getRowClass = newFunctionName.createSequence(gridView.getRowClass);

Ben

[Vladimir]

Hi,

Yes, you can use createSequence/createInterceptor but you can get unxpected result.

<Render Handler="this.getView().getRowClass = this.getView().getRowClass.createSequence(myGetRowClassFunc, this.getView());" />

[Ben]

Thanks, I'll have a play.

Ben

[Ben]

I had this working OK but since the upgrade to 1.0 it's not been playing ball.

Any suggestions on how to get this working with v1?


Thanks,

Ben

[Vladimir]

Hi,

Please demonstrate how the things are configured (test example)

[rthiney]

Any update on this?

[Daniil]

Now there is the same situation.

You can override the RowExpander's getRowClass method, but be careful to get unexpected result.

Here is the original code of the getRowClass method with a possibility to override.

Example

<ext:ResourcePlaceHolder runat="server" Mode="ScriptFiles" />
<script type="text/javascript">
    Ext.grid.RowExpander.override({
        getRowClass : function (record, rowIndex, p, ds) {
            p.cols = p.cols - 1;
            var content = this.bodyContent[record.id];
        
            if (!content && !this.lazyRender) {
                content = this.getBodyContent(record, rowIndex);
            }
        
            if (content) {
                p.body = content;
            }
        
            return this.state[record.id] ? "x-grid3-row-expanded" : "x-grid3-row-collapsed";
        }
    });
</script>