Наверняка, одними из самых часто используемых вами yii2 виджетов станут yii\widgets\ActiveForm и его улучшенная Bootstrap 3 версия — yii\bootstrap\ActiveForm.
Сегодня рассмотрим использование yii\bootstrap\ActiveForm в деталях. Наглядным примером послужит демонстрация и исходные коды (модуль simpleactiveform).
Импорт нужных классов
Первым делом укажем, где искать используемые классы ActiveForm и Html.
use yii\bootstrap\ActiveForm; use yii\helpers\Html;
Инициализация формы в представлении
Начало формы реализует метод begin() . В массиве передаем настройки формы, html идентификатор и класс, а так же ‘enctype’ => ‘multipart/form-data’, для возможности загрузки файлов.
//$form = ActiveForm::begin(); // Инициализация формы с настройками по-умолчанию
$form = ActiveForm::begin([
'id' => 'form-input-example',
'options' => [
'class' => 'form-horizontal col-lg-11',
'enctype' => 'multipart/form-data'
],
]);
// Содержимое формы
ActiveForm::end();
Ввод текста
Простое текстовое поле
Для вывода простого текстового поля достаточно выполнить $form->field($model,’name’);. В примере показано, как указать всплывающую подсказку и имя поля.
$form->field($model, 'text')->textInput()->hint('Введите любой текст')->label('Текстовое поле');
Многострочное текстовое поле
Пример вывода textarea с параметрами и заголовком.
$form->field($model, 'textArea')->textarea(['rows' => 2, 'cols' => 5])->label('Многострочное текстовое поле');
Ввод пароля
Введенные символы будут скрыты звездочками. Два варианта.
// Поле с подсказкой
$form->field($model, 'password')->passwordInput()->hint('Длинна пароля не меньше 10 символов.');
// Простое поле ввода пароля
$form->field($model, 'password')->input('password');
Поле ввода email
В ногу с html5, можно использовать специальное поле для ввода адреса электронной почты.
$form->field($model, 'email')->input('email');
Загрузка файлов
Метод fileInput() используется для загрузки файлов. Параметр ‘multiple’ позволяет включить загрузку нескольких файлов одновременно.
Одиночная загрузка
$form->field($model, 'fileUpload')->fileInput();
Загрузка нескольких файлов сразу
$form->field($model, 'filesUpload[]')->fileInput(['multiple' => 'multiple']);
Чекбоксы
Вывод полей чекбокс осуществляется при помощи методов checkbox() и checkboxList().
Одиночный чекбокс
Вывод неактивного чекбокса с указанием заголовка и css стиля.
$form->field($model, 'checkbox')
->checkbox([
'label' => 'Неактивный чекбокс',
'labelOptions' => [
'style' => 'padding-left:20px;'
],
'disabled' => true
]);
Группа чекбоксов
$form->field($model, 'checkboxList')
->checkboxList([
'a' => 'Элемент А',
'б' => 'Элемент Б',
'в' => 'Элемент В',
]);
Радио кнопки
Одиночная радио кнопка
$form->field($model, 'radioButton')
->radio([
'label' => 'Радио кнопка',
'labelOptions' => [
'style' => 'padding-left:20px;'
]
]);
Группа радио кнопок
$form->field($model, 'radioButtonList')
->radioList([
'1' => 'Первый',
'2' => 'Второй',
'3' => 'Третий'
]);
Список
Простой список с возможностью выбора нескольких вариантов.
$form->field($model, 'listBox')
->listBox([
'1' => '1',
2 => '2',
'3' => 3,
4 => 4,
5 => 5
],
[
'multiple' => true,
'prompt' => 'Выберите один или несколько вариантов',
'style' => 'background:gray;color:#fff;'
]);
Выпадающий список
Вывод выпадающего списка с возможностью выбора только одного варианта.
$form->field($model, 'dropdownList')
->dropDownList([
'А' => 'Вариант А',
'Б' => 'Вариант Б',
'В' => 'Вариант В',
],
[
'prompt' => 'Выберите один вариант'
]);
Кнопка отправки формы
Классический элемент submit для отправки содержимого формы.
Html::submitButton('Сохранить', ['class' => 'btn btn-primary']);
Заключение
Встроенный yii2 виджет ActiveForm перекрывает 90% потребностей программиста при создании пользовательского интерфейса в части html форм. При необходимости можно самостоятельно расширить этот класс или попытаться найти решения в сообществе.
То что надо! Долго искал эту информацию!
Спасибо, супер.
как добавить свой id для каждого поля? yii ведь сам генерирует.
С удавольствием поддержу проект!!!
$form->field() принимает третьим параметром массив с настройками. Где при помощи ‘inputOptions’ можно настроить параметры тега input.
Пример:
$form->field($model, ’email’, [
‘inputOptions’ => [
‘id’ => ‘my-email-input-id’,
],
])->input(’email’);
и кодировку UTF-8 поставить?
кодировку устанавливаем:
1. В настройках веб-сервера;
2. В layout, при помощи тега ;
3. Все файлы, в том числе *.php, сохраняем в кодировке «UTF-8 без БОМ».
Здравствуйте! Вот везде вижу ‘id’ => ‘form-input-example’,
А где этот айди потом высплывает? В Yii::$app->request->post() его почему-то нет! Зачем он и где его достать?
Это установка атрибута id формы:
А не подскажите в чём может быть проблема??
Необходимо вместе с 3-мя текстовыми полями загрузить картинку-эмблемку. В виде, в форме:
field($model, ‘team_league’)->dropDownList([‘1’ => ‘Испания’, ‘2’ => ‘Англия’, ‘3’ => ‘Германия’]) ?>
field($model, ‘team_name’)->textInput([‘maxlength’ => true]) ?>
field($model, ‘team_embl’)->fileInput() ?>
field($model, ‘team_stadium’)->textInput([‘maxlength’ => true]) ?>
isNewRecord ? ‘Добавить’ : ‘Обновить’, [‘class’ => $model->isNewRecord ? ‘btn btn-danger’ : ‘btn btn-primary’]) ?>
В контроллере:
public function actionCreate()
{
$model = new Team();
$modelFile = new UploadForm();
if (Yii::$app->request->isPost) {
$modelFile->team_embl = UploadedFile::getInstance($model, ‘team_embl’);
if ($modelFile->team_embl && $modelFile->validate()) {
$modelFile->team_embl->saveAs(‘img/embl/’ . $modelFile->team_embl->baseName . ‘.’ . $modelFile->team_embl->extension);
$model->team_embl = ‘/img/embl/’ . $modelFile->team_embl->baseName . ‘.’ . $modelFile->team_embl->extension;
}
}
if ($model->load(Yii::$app->request->post()) && $model->save()) {
return $this->redirect([‘view’, ‘id’ => $model->team_id]);
} else {
return $this->render(‘create’, [
‘model’ => $model,
‘modelFile’ => $modelFile,
]);
}
}
Но всё равно В массиве $_POST:
[ ‘team_league’ => ‘3’
‘team_name’ => ‘Айнтрахт’
‘team_embl’ => »
‘team_stadium’ => ‘Стадион’ ]
Уже просто отчаялся — что только не пробовал! Ставить отдельное расшерение для этого совсем не хочется
календарь или DateTimePicker есть в стандарте?
Есть.
<?php
…
use yiiwidgetsActiveForm;
…
…
field($model, ‘added’)->widget(yiijuiDatePicker::classname(), [‘dateFormat’ => ‘yyyy-MM-dd’]) ?>
Есть.
widget(yiijuiDatePicker::classname(), [‘dateFormat’ => ‘yyyy-MM-dd’]) ?>
Класс yiiwidgetsActiveForm будет читать правила проверки заявленные в модели и генерировать соответствующий код JavaScript для валидаторов, которые поддерживают проверку на стороне клиента. Когда пользователь изменяет значение поля ввода или отправляет форму, JavaScript на стороне клиента будет срабатывать и проверять введенные данные.