A
A
Adel1ne2016-06-26 09:38:02
Yii
Adel1ne, 2016-06-26 09:38:02

How to properly clear inputs in ActiveForm in Yii2?

Hello!
There is a standard form:

<?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(); ?>

There are all sorts of validators, after which messages may appear, for example, if the input login did not pass validation:
<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>

, then when you click on the login button, the page will be reloaded and the has-error error class will be added to the login field and the message " This login is already in the database. " will appear:
<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>

The essence of the problem is that I have this form in a modal window and when I open it again, I want to clear the values ​​​​of all fields and remove the display of all errors.
At the moment, using jQuery methods, I have achieved the desired result, on opening a modal window, I hang up the commands:
$('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('');
        });

I remove all value from input type="text", remove the has-error class, and erase the error message.
Everything would be fine, but after that there is one glitch:
If you stand on the login field, do not enter anything and go to the next field, then the error of the empty field works immediately on all inputs, and before that the error appeared only for the input from which I left the cursor.
Why is this happening and how to do a normal cleaning? Perhaps there is a less clumsy solution in the ActiveForm class itself?

Answer the question

In order to leave comments, you need to log in

3 answer(s)
N
Nikita, 2016-06-26
@bitver

Return in the controller not the model that was loaded and validated, but new LoginForm().

O
Oleg, 2016-06-26
@politon

So not?
window.onload = function(){
document.getElementById('field1').value = '';
document.getElementById('field2').value = '';
document.getElementById('field3').value = '';
}

N
Nikolay, 2019-12-16
@fedek

->input('text', ['class' => 'form-control', 'placeholder' => 'your new password', 'value' => '', ]) ?>

Didn't find what you were looking for?

Ask your question

Ask a Question

731 491 924 answers to any question