CodeStore.ru

  ...
  xtype:'toolbar',
  style: {
    border: 0,
    padding: 2
  },
  ...

При группировке записей сортировка групп происходит по названию, а если есть необходимость отсортировать группы по какому-либо другому столбцу, то можно пойти обходным путем. Идея в том, чтобы в текст поля, по которой производится группировка, был добавлен префикс, например, в виде номера, но с заполненными нулями старшими разрядами. Например, есть таблица с сотрудниками, и надо сгруппировать записи по отделу, а сортировку отделов задать по их приоритету:

+---------------+-----------+--------------+
| Подразделение | Приоритет |     ФИО      |
+---------------+-----------+--------------+
|  Управление   |     1     | Иванов И.И.  |
+---------------+-----------+--------------+
|  Управление   |     1     | Петров П.П.  |
+---------------+-----------+--------------+
|  отдел ИТ     |    12     | Сидоров С.С. |
+---------------+-----------+--------------+
|  отдел ИТ     |    12     | Васильев В.В.|
+---------------+-----------+--------------+
|  Финансовый   |    34     | Сергеева А.Б.|
+---------------+-----------+--------------+
|  Финансовый   |    34     | Семенова К.В.|
+---------------+-----------+--------------+

При обычной группировке по полю «Подразделения» отсортируются по алфавиту (отдел ИТ, Управление, Финансовый), а требуется по приоритету. Перед передачей массива гриду модифицируем значения столбца «Подразделения» так:
001~Управление
012~отдел ИТ
034~Финансовый
Заполнение старших разрядов можно сделать с помощью функции ZeroFill, код которой я приводил в одной из предыдущих статей. Записи отсортируются по приоритету, а избавиться от префикса можно в шаблоне заголовка группы:

// фича grid-а для группировки записей с объявлением шаблона отображения
var groupingFeature =
Ext.create('Ext.grid.feature.Grouping',{ groupHeaderTpl: '
{name}

' });

// в гриде объявляем
features: [groupingFeature],
viewConfig: {
    stripeRows: true,
    listeners: {
        refresh: function(){
            $('.ght').each(function(){
                $(this).html($(this).html().split('~')[1]);
            });
        }
    }
},

Задача: есть два datefield на форме и необходимо, чтобы в первом, где выбирается начальная дата, нельзя было выбрать значение, превышающее дату окончания. И наоборот.
Решение:

    Ext.apply(Ext.form.field.VTypes, {
        daterange: function (val, field) {
            var date = field.parseDate(val);
            if (!date) { return false; }
            if (field.startDateField && (!this.dateRangeMax || (date.getTime() != this.dateRangeMax.getTime()))) {
                var start = field.up('form').down('#' + field.startDateField);
                start.setMaxValue(date);
                start.validate();
                this.dateRangeMax = date;
            }
            else if (field.endDateField && (!this.dateRangeMin || (date.getTime() != this.dateRangeMin.getTime()))) {
                var end = field.up('form').down('#' + field.endDateField);
                end.setMinValue(date);
                end.validate();
                this.dateRangeMin = date;
            }
            return true;
        },
        daterangeText: 'Начальная дата должна быть меньше конечной'
    });

// способ применения (в конфиге формы, например)
items: [{
    xtype: 'datefield',
    startDay: 1,
    fieldLabel: 'Начало периода',
    id: 'startdt',
    vtype: 'daterange',
    endDateField: 'enddt'
}, {
    xtype: 'datefield',
    startDay: 1,
    fieldLabel: 'Окончание периода',
    id: 'enddt',
    vtype: 'daterange',
    startDateField: 'startdt'
}]