Как добавить панель под заголовком в отображаемой сетке в ExtJs

Question

Допустим, у меня есть эта сетка:

http://dev.sencha.com/deploy/ext-4.0.7-gpl/examples/grid/group-header-grid.html

Как добавить еще один заголовок, панель или как мы ее называем под исходными заголовками:

http://img851.imageshack.us/img851/3537/panelnu.png

, чтобы он был независим от столбцов под ним и над ним и занимал 100% ширины?

Answer 1

Добавьте панель как закрепленный: «верхний» закрепленный элемент с большим весом (тяжелые элементы тяготеют к центру панели)

Таким образом, эта панель будет закреплена ниже заголовков.

Answer 2

Это возможно, изменив разметку в afterrender слушателе в сетке:

afterrender: function() {
    var view = this.getView();
    var el = view.getHeaderCt().getEl();

    var div = document.createElement('div');
    div.innerHTML = 'Header';
    el.dom.appendChild(div);
}

Вот рабочий образец: http://jsfiddle.net/nUjmx/ Вам нужно только стилизовать его.