ExtJS 4.2 How to set grid filter height when heade

问题:

I have a grid with many columns, each of them has a filter, and some of the columns has a long text in the header:

I added a css rule to wrap text in the header:

.x-column-header-inner .x-column-header-text { white-space: pre-wrap; }

In result I got filters with different height:

How to make the same height filters?

回答1:

I implemented the search filter with your hint. You can find it here. I didn't have your issue with long column labels. They just cut off using an ellipsis like it is the standard behavior in ExtJs.

回答2:

I've solved my issue by including search filters into fieldcontainers, and using vbox layout with pack at the end.

items: [
    {
        xtype: 'fieldcontainer',
        layout: {
                    type: 'vbox', pack: 'end'
                },
        width: '100%',
        items: [
            {
                xtype: 'triggerfield',
                ...other code...
            }
        ]
    }
]