Скрытие заголовка столбца сетки ExtJS

Question

Я понимаю, что могу скрыть заголовок столбца сетки, используя код.

#gridid .x-grid3-hd-row { display:none; }

Но я не хочу использовать какие-либо изменения CSS. Как сделать то же самое с помощью JavaScript?

Answer 1

Вы можете сделать это легко, добавив это к Ext.grid.GridPanel следующим образом:

hideHeaders: true

Answer 2

Вы можете установить hideHeaders параметр конфигурации GridPanel на true. Или вы имеете в виду после того, как сетка отображается?

Отредактировано: Если вы хотите изменить (или отключить) способ создания заголовка, вы также можете переопределить renderHeaders или updateHeaders с GridView. Другим способом может быть передача опции templates в GridView со значением header, установленным в пустой шаблон вместо значения по умолчанию:

ts.header = new Ext.Template(
    '',
    '{cells}',
    '
'
);

Хотя реализация по умолчанию записывает заголовок в this.innerHd, а innerHd определяется как this.mainHd.dom.firstChild, а this.mainHd устанавливается в скрытое, если установлена ​​опция hideHeaders. Поэтому я ожидаю, что эта опция также повлияет на заголовки столбцов.

Отредактировано: О какой версии ExtJS мы говорим? Я посмотрел на текущий источник , что на 3,1, я думаю.

Answer 3

просто добавьте hideHeaders: true в свою сетку. это должно работать

Answer 4

Вы можете добавить это к определению вашей сетки:

listeners: {
    render: function(grid) {
        grid.getView().el.select('.x-grid3-header').setStyle('display', 'none');
    }
},

Answer 5

Обычно вы в конечном итоге хотите этого, когда помещаете свою сетку в панель.

Для меня взломы CSS казались плохими, и только это работало:

preventHeaders: true

См. Свойство здесь, в документации.