Диалог редактирования записи без источника данных

В случаях, когда нет источника и список строится на основе статических данных (RecordSet), для редактирования записей списка необходимо использовать контроллер Controls/form:ControllerBase - диалог редактирования записи из статического источника.

Диалог редактирования позволит не потерять данные за счет того, что при закрытии выведет информационное окно с вопросом о сохранении внесенных пользователем изменений.

Пример
Исходный код

Добавление контроллера редактирования и его конфигурация

Для работы с диалогом редактирования необходимо обернуть шаблон, расположенный внутри окна редактирования (стековую панель/диалог), в Controls/form:ControllerBase:

<!-- WML -->
<Controls.form:ControllerBase>
    <Controls.popupTemplate:Stack>
        ...
    </Controls.popupTemplate:Stack>
</Controls.form:ControllerBase>

В поле record контроллера передать запись, по данным которой будет инициализирован диалог редактирования:

<!-- WML -->
<Controls.form:ControllerBase 
      record="{{ _options.record }}">
    <Controls.popupTemplate:Stack>
        ...
    </Controls.popupTemplate:Stack>
</Controls.form:ControllerBase>

В контенте разместить контролы, которые могут редактировать записи:

<!-- WML -->
<Controls.form:ControllerBase record="{{ _options.record }}" name="formController">
    <Controls.popupTemplate:Stack>
        <ws:bodyContentTemplate>
            <Controls.propertyGrid:PropertyGrid 
                editingObject="{{ content.record }}" 
                source="{{_propertyGridSource}}" />
        </ws:bodyContentTemplate>
    </Controls.popupTemplate:Stack>
</Controls.form:ControllerBase>

Инициализация данных диалога редактирования

Существует два способа инициализации данных диалога редактирования: создание новой записи и редактирование записи.

Пример 1: Создание новой записи с помощью диалога редактирования

Новую запись необходимо создавать по формату RecordSet'а списка.

// TypeScript
protected _itemClickHandler(event: SyntheticEvent < MouseEvent > , item: Model): void {
    this._openDialog(item.clone());
}
<!-- WML -->
<Controls.buttons:Button caption="Создать" />
<Controls.grid:View 
    source="{{ _listSource }}" 
    on:itemClick="_itemClickHandler()">
</Controls.grid:View>

Пример 2: Редактируемая запись извлекается из списочного контрола

В этом примере показано, как настроить открытие диалога редактирования при клике по записи списка. При этом редактируемая запись извлекается из списочного контрола.

// TypeScript
protected _createClickHandler(): void {
    const key = this._items.getCount() + 1;
    const newModel = new Model({
        keyProperty: this._items.getKeyProperty(),
        format: this._items.getFormat(),
        rawData: {
            id: key
        }
    });
    this._openDialog(newModel, true);
}
<!-- WML -->
<Controls.buttons:Button 
    caption="Создать" 
    on:click="_createClickHandler()" />

Открытие диалога редактирования

Для открытия диалога редактирования используйте один из базовых опенеров:

У контрола-опенера вызовите метод open() и передайте в templateOptions метода редактируемую запись (record).

// TypeScript
protected _openDialog(record: Model, isCreate ? : boolean): void {
    this._stackOpener.open({
        opener: this,
        templateOptions: {
            record: record
        }
    });
}

Закрытие диалога редактирования

Закрыть диалога редактирования можно, вызвав событие close:

// TypeScript
protected _saveClickHandler(): void {
    this._children.formController.update().then(() => {
        this._notify('close', [], { bubbling: true});
    });
}

Обработка результатов редактирования

Обработать результат редактирования можно с помощью события updateSuccessed, которое происходит при успешном обновлении записи.

<!-- WML -->
<Controls.form:ControllerBase
    record="{{ _options.record }}"
    on:updateSuccessed="_updateSuccessedHandler()"
    name="formController">
    ...
</Controls.form:ControllerBase>

Синхронизация изменений со списочным контролом

Для синхронизации изменений списочного контрола необходимо использовать утилиту Controls/Utils/RecordSynchronizer, которая возвращает набор методов, с помощью которых можно добавить/удалить/обновить запись в рекордсете:

  • addRecord - добавляет запись в рекордсет.
  • deleteRecord - удаляет запись из рекордсета.
  • mergeRecord - обновляет запись в рекордсете.
// TypeScript
protected _openDialog(record: Model, isCreate ? : boolean): void {
    this._stackOpener.open({
        opener: this,
        templateOptions: {
            record,
            saveCallback: (record: Model): void => {
                const items = this._children.grid.getItems();
                if (isCreate) {
                    addRecord(record, {}, items);
                } else {
                    mergeRecord(record, items, record.getKey());
                }
            }
        }
    });
}

См. также

Следующие настройки для Controls/form:ControllerBase выполняются аналогично стандартному диалогу редактирования: