Блокирование полей ​

Блокировка полей упрощает работу с формами, делая процесс разработки максимально динамическим. Для блокирования полей был создан простой механизм доступности, которые позволяет блокировать и разблокировать дочерние элементы. Мы рекомендуем использовать его, вместо передачи параметра disabled в FormField.

Методы ​

Имеется два метода disable и enable для блокировки и разблокировки полей соответственно. Данный методы вызываются у экземпляра Form:

const form = new Form();
form.disable(); // Блокировка всей формы
form.enable('name'); // Разблокировка только поля name

const form = new Form();
form.disable(); // Блокировка всей формы
form.enable('name'); // Разблокировка только поля name

Параметры ​

В случае, если ни одного параметра не передано - форма, а также все дочерние элементы, будут заблокирована / разблокировано целиком.

name Необязательный ​

Строка или массив строк - поля для которых нужно произвести механизм доступности.

form.enable(); // [1]
form.disable('address'); // [2]
form.enable(['address.city', 'address.country']); // [3]

form.enable(); // [1]
form.disable('address'); // [2]
form.enable(['address.city', 'address.country']); // [3]

• [1] - полная разблокировка формы. По умолчанию форма находится в состоянии disabled: false.
• [2] - блокировка поля address. Все дочерние элементы (address.city, address.details.code) будут также заблокированы.
• [3] - Разблокировка переданных полей. Заметьте, что поле address продолжит находиться в состоянии блокировки.

Состояние ​

Чтобы понять, что форма заблокирована или разблокирована можно воспользоваться одним из свойств:

• disabled - имеет значение true, если форма заблокирована
• enabled - имеет значение true, если форма разблокирована

form.eneable()
form.eneabled // true
form.disabled // false

form.disable();
form.eneabled // false
form.disabled // true

form.eneable()
form.eneabled // true
form.disabled // false

form.disable();
form.eneabled // false
form.disabled // true

Проверка дочерних элементов ​

Для проверки на состояние дочернего элемента воспользуйтесь методом checkFieldDisable, который возвращается логическое значение - является ли поле заблокированным.

Параметры ​

name Обязательное ​

Строковое название поля, для которого необходимо провести проверку.

const form = new Form();

forn.disable();
form.checkFieldDisable('address') ; // true

form.enable('user');
form.checkFieldDisable('user.login'); // false

const form = new Form();

forn.disable();
form.checkFieldDisable('address') ; // true

form.enable('user');
form.checkFieldDisable('user.login'); // false

События ​

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

Для отлавливания изменение состояния формы целиком.

onavailable(callback: (disabled: boolean) => any): FunctionRemoveOnCallback

onavailable(callback: (disabled: boolean) => any): FunctionRemoveOnCallback

Для отлавливания изменения конкретного поля.

onavailable(fieldName: string, callback: (disabled: boolean) => any): FunctionRemoveOnCallback

onavailable(fieldName: string, callback: (disabled: boolean) => any): FunctionRemoveOnCallback

onavailable возвращает функцию, которую нужно вызвать, чтобы отписаться от запрошенного события.