Yii2. Виджет ActiveForm
Рассмотрим часто использующийся при разработке виджет ActiveForm
. Виджет позволяет добавить на сайт форму с полями ввода, кнопками, списками выбора, чекбоксами, радио кнопками. Для создания формы подключаем в шаблоне следующие классы:
// подключаем помощник html разметки use yii\helpers\Html; // подключаем виджет для работы с формами use yii\widgets\ActiveForm; // для добавления captcha use yii\captcha\Captcha;
// вместо yii\widgets\ActiveForm можно использовать версию под // bootstrap 3, которая предоставляет дополнительные возможности use yii\bootstrap\ActiveForm;
Инициализация формы
$form = ActiveForm::begin([ // идентификатор формы 'id' => 'feedback-form', 'options' => [ // класс формы 'class' => 'form-horizontal', // возможность загрузки файлов 'enctype' => 'multipart/form-data' ] ]); /* Сюда добавляем поля формы */ ActiveForm::end();
<form id="feedback-form" class="form-horizontal" action="/web/index.php?r=page%2Ffeedback" method="post"> <input type="hidden" name="_csrf" value="....."> </form>
Текстовое поле
Простое текстовое поле
echo $form->field($model,'name');
<form id="feedback-form" class="form-horizontal" action="/web/index.php?r=page%2Ffeedback" method="post"> <input type="hidden" name="_csrf" value="....."> <div class="form-group field-feedbackform-name"> <label class="control-label" for="feedbackform-name">Name</label> <input type="text" id="feedbackform-name" class="form-control" name="FeedbackForm[name]"> <div class="help-block"></div> </div> </form>
Текстовое поле с подсказкой и описанием
echo $form->field($model, 'name')->textInput()->hint('Введите имя')->label('Имя');
<form id="feedback-form" class="form-horizontal" action="/web/index.php?r=page%2Ffeedback" method="post"> <input type="hidden" name="_csrf" value="....."> <div class="form-group field-feedbackform-name"> <label class="control-label" for="feedbackform-name">Имя</label> <input type="text" id="feedbackform-name" class="form-control" name="FeedbackForm[name]"> <div class="hint-block">Введите имя</div> <div class="help-block"></div> </div> </form>
Текстовое поле для e-mail
Простое поле для e-mail
echo $form->field($model, 'email')->input('email');
<form id="feedback-form" class="form-horizontal" action="/web/index.php?r=page%2Ffeedback" method="post"> <input type="hidden" name="_csrf" value="....."> <div class="form-group field-feedbackform-email"> <label class="control-label" for="feedbackform-email">Email</label> <input type="email" id="feedbackform-email" class="form-control" name="FeedbackForm[email]"> <div class="help-block"></div> </div> </form>
Поле с подсказкой и описанием
echo $form->field($model, 'email')->input('email')->hint('Введите адрес почты')->label('Электронный адрес');
<form id="feedback-form" class="form-horizontal" action="/web/index.php?r=page%2Ffeedback" method="post"> <input type="hidden" name="_csrf" value="....."> <div class="form-group field-feedbackform-email"> <label class="control-label" for="feedbackform-email">Электронный адрес</label> <input type="email" id="feedbackform-email" class="form-control" name="FeedbackForm[email]"> <div class="hint-block">Введите адрес почты</div> <div class="help-block"></div> </div> </form>
Поле для ввода пароля
Простое поле для пароля
// первый вариант echo $form->field($model, 'password')->passwordInput(); // второй вариант echo $form->field($model, 'password')->input('password');
<form id="feedback-form" class="form-horizontal" action="/web/index.php?r=page%2Ffeedback" method="post"> <input type="hidden" name="_csrf" value="....."> <div class="form-group field-feedbackform-password"> <label class="control-label" for="feedbackform-password">Password</label> <input type="password" id="feedbackform-password" class="form-control" name="FeedbackForm[password]"> <div class="help-block"></div> </div> </form>
Поле с подсказкой и описанием
echo $form->field($model, 'password') ->passwordInput() ->hint('Пароль должен содержать латинские символы и буквы') ->label('Введите пароль');
<form id="feedback-form" class="form-horizontal" action="/web/index.php?r=page%2Ffeedback" method="post"> <input type="hidden" name="_csrf" value="....."> <div class="form-group field-feedbackform-password"> <label class="control-label" for="feedbackform-password">Введите пароль</label> <input type="password" id="feedbackform-password" class="form-control" name="FeedbackForm[password]"> <div class="hint-block">Пароль должен содержать латинские символы и буквы</div> <div class="help-block"></div> </div> </form>
Многострочное текстовое поле
Простое многострочное поле
echo $form->field($model, 'body')->textarea();
<form id="feedback-form" class="form-horizontal" action="/web/index.php?r=page%2Ffeedback" method="post"> <input type="hidden" name="_csrf" value="....."> <div class="form-group field-feedbackform-body"> <label class="control-label" for="feedbackform-body">Body</label> <textarea id="feedbackform-body" class="form-control" name="FeedbackForm[body]"></textarea> <div class="help-block"></div> </div> </form>
Многострочное поле определенного размера с описанием
echo $form->field($model, 'body')->textarea(['rows'=>4,'cols'=>10])->label('Сообщение');
<form id="feedback-form" class="form-horizontal" action="/web/index.php?r=page%2Ffeedback" method="post"> <input type="hidden" name="_csrf" value="....."> <div class="form-group field-feedbackform-body"> <label class="control-label" for="feedbackform-body">Сообщение</label> <textarea id="feedbackform-body" class="form-control" name="FeedbackForm[body]" rows="4" cols="10"></textarea> <div class="help-block"></div> </div> </form>