Form.md

Form

Компонент формы.

Оформление формы

<Form info={info} error={error} success={sucess}/>

Параметры info, error и success могут содержать описание формы, сообщение об ошибке или сообщение об успехе соответственно. Блоки будут выведены в самом верху форму, до всех дочерних элементов.

Отправка данных

const onSubmit = (data: FormData) => {
    // Код обработки данных формы
};

<Form submit={submit} onSubmit={onSubmit}/>

При указании параметра submit после всех дочерних элементов формы будет выведена кнопка отправки данных формы с указанным в submit текстом. При указании через параметр onSubmit функции обработки отправки данных, она будет вызвана при нажатии на кнопку. В функцию будет передан объект с данными формы.

Реакция на обязательные поля

У элементов ввода внутри формы с установленным параметром required, форма будет проверять параметр value. Если хотя бы у одного из обязательных полей данный параметр будет пустой (с учетом отбрасывания пробельных символов с начала и конца), кнопка отправки данных формы будет отмечена как disabled.

Свойства и методы

Prop name	Type	Default	Description
info?	string		Описание формы
error?	string		Сообщение об ошибке
success?	string		Сообщение об успехе
submit?	string		Надпись на кнопке отправки
cancel?	string		Надпись на кнопке отмены
submitType?	Accent|Error|Success|Default	Accent	Тип кнопки отправки
cancelType?	Accent|Error|Success|Default	Error	Тип кнопки отмены
onSubmit?	(d: FormData) => void		Обработчик нажатия на кнопку отправки
onCancel?	() => void		Обработчик нажатия на кнопку отмены
wide?	boolean		Флаг увеличенного размера формы

Данные формы

interface FormData {
    [i: string]: string | boolean | number | File[] | any[];
};

В качестве имен полей будут использованы идентификаторы элементов ввода id. Если идентификаторы будут повторяться, то значения будут записываться в массив значений.