Здравствуйте!
Есть стандартная форма:
<?php $form = ActiveForm::begin([
'id' => 'login-form',
'options' => ['class' => 'form-horizontal'],
'fieldConfig' => [
'template' => "{label}\n<div class=\"col-lg-3\">{input}</div>\n<div class=\"col-lg-8\">{error}</div>",
'labelOptions' => ['class' => 'col-lg-1 control-label'],
],
]);
?>
<?= $form->field($model, 'login') ?>
<?= $form->field($model, 'password') ?>
<?= $form->field($model, 'name') ?>
<div class='form-group'>
<div class='col-lg-offset-1 col-lg-11'>
<?= Html::submitButton('Login', ['class' => 'btn btn-primary', 'name' => 'login-button']) ?>
</div>
</div>
<?php ActiveForm::end(); ?>
Там стоят всякие валидаторы, после которых могут появится сообщения, например, если input login не прошел валидацию:
<div class="form-group field-editform-login required">
<label class="control-label col-lg-3" for="editform-login">Логин</label>
<div class="col-lg-3"><input type="text" id="editform-login" class="form-control" name="EditForm[login]"></div>
<div class="col-lg-8"><p class="help-block help-block-error"></p></div>
</div>
, то при нажатии на кнопку login, произойдет перезагрузка страницы и полю login добавится класс ошибки
has-error и появится сообщение "
Такой логин уже есть в БД.":
<div class="form-group field-editform-login required has-error">
<label class="control-label col-lg-3" for="editform-login">Логин</label>
<div class="col-lg-3"><input type="text" id="editform-login" class="form-control" name="EditForm[login]"></div>
<div class="col-lg-8"><p class="help-block help-block-error">Такой логин уже есть в БД.</p></div>
</div>
Суть проблемы в том, что эта форма у меня в модальном окне и при повторном ее открытии я хочу очистить значения всех полей и убрать отображение всех ошибок.
На данный момент методами jQuery, я добился нужного результата, на открытие модального окна, я вешаю команды:
$('form#edit-form input[type="text"]').each(function() {
$(this).removeAttr('value');
});
$('form#edit-form div.form-group').each(function() {
$(this).removeClass('has-error');
});
$('form#edit-form p.help-block').each(function() {
$(this).text('');
});
Я убираю все value у input type="text", убираю класс has-error, и затираю сообщение об ошибке.
Все бы хорошо, но после этого происходит один глюк:
Если встать на поле логин, ничего не вводить и перейти на следующее поле, то ошибка незаполненного поля срабатывает сразу на все input'ы, а до этого ошибка появлялась только у input'a с которого я уходил курсором.
Почему так происходит и как сделать нормальную очистку? Возможно есть менее топорное решение в самом классе ActiveForm?