ExtJS 6 - добавить элемент управления текстовым полем в заголовок столбца динамической сетки - PullRequest
Новая
       29

ExtJS 6 - добавить элемент управления текстовым полем в заголовок столбца динамической сетки

1 голос
/ 26 октября 2019

Я пытаюсь добавить текстовое поле (или поле со списком) в заголовок столбца динамической сетки.

Есть предложения по использованию свойства "items" для решения этой проблемы, как в примере ниже (строка 81 в действии пример ): 

   ...
        text: 'Email',
        flex: 1,
        menuDisabled: true,
        sortable: false,
        dataIndex: 'email',
        items: [{
            xtype: 'textfield',
            labelWidth: 40,
            flex: 1,
            fieldLabel: 'Email'
        }]
   ...

И это в принципе работает, но есть несколько проблем с макетом, которые я не могу решить самостоятельно:

  1. элемент управления текстовым полем появляется подзаголовок столбца (ожидайте выравнивание элементов по горизонтали);
  2. высота заголовка столбца слишком большая (должно быть нормальным);

Вот картинка что я хочучтобы получить.

Также в скрипте есть живой пример с упомянутыми проблемами.

Есть какие-нибудь идеи, как это исправить?

1 Ответ

1 голос
/ 26 октября 2019

Вы были там, вот изменения кода, которые я сделал. 

function getColumnConfigs() {
return [{
    text: 'Name',
    dataIndex: 'name',
    flex: 1
}, {
    text: '',
    flex: 1,
    menuDisabled: true,
    sortable: false,
    dataIndex: 'email',
    items: [{
        xtype: 'combobox',
        store: ages,
        valueField: 'age',
        displayField: 'age',
        labelWidth: 40,
        padding: '0 0 0 10',
        flex: 1,
        fieldLabel: 'Age'
    }]
}]

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

и скрипка .

...