How i can change style Html::error? I want make
<div style="backgraund-color: blue; hieght:30px; width: 30px;">Error - ........</div>
<?php $form = ActiveForm::begin(); ?>
<?= Html::activeTextInput($model, 'password') ?>
<?= Html::error($model, 'password') ?>
<?php ActiveForm::end(); ?>
Since you have used ActiveForm, this is the easiest way to create custom error styles;
When we use the following code:
<?php $form = ActiveForm::begin(['id' => 'login-form']); ?>
<?= $form->field($model, 'username') ?>
<?php ActiveForm::end(); ?>
we will get the html output for the username field as
<div class="form-group field-loginform-username required has-error">
<label class="control-label" for="loginform-username">Username</label>
<input id="loginform-username" class="form-control" name="LoginForm[username]" type="text">
<p class="help-block help-block-error">Username cannot be blank.</p>
</div>
You can see the default error class coming with yii
Now, if you use like below:
<?php $form = ActiveForm::begin(['id' => 'login-form']); ?>
<?= $form->field($model, 'username', ['errorOptions'=>['class'=>'mystyle']]) ?>
<?php ActiveForm::end(); ?>
you will get the custom error class "mystyle" as below:
<div class="form-group field-loginform-username required has-error">
<label class="control-label" for="loginform-username">Username</label>
<input id="loginform-username" class="form-control" name="LoginForm[username]" type="text">
<p class="mystyle">Username cannot be blank.</p>
</div>
The style is applied immediately
<?php
use yii\helpers\Html;
use yii\widgets\ActiveForm;
?>
<style>
.mystyle{
background-color: blue;
height: 95px;
width: 95px
}
</style>
<!--['id' => 'login-form', 'options' => ['data-pjax' => true]]-->
<?php $form = ActiveForm::begin(['id' => 'login-form', 'options' => ['data-pjax' => true]]); ?>
<?= $form->field($model, 'name', ['errorOptions'=>['class'=>'mystyle']]) ?>
<?= $form->field($model, 'email') ?>
<div class="form-group">
<?= Html::submitButton('Отправить', ['class' => 'btn btn-primary']) ?>
</div>
<?php ActiveForm::end(); ?>
How make add style if get error?
Up…
Hi,
at the time of validation, based on the success and error, there are two classes added to the fields, "has-success" and "has-error".
These two classes are defined in the bootstrap.css. You can look at bootstrap.css file and see how it is defined.
Now, you can define "has-error" in any of your custom css file, say "style.css" and load after "bootstrap.css".
<link href="/assets/a461f600/css/bootstrap.css" rel="stylesheet">
<link href="/css/style.css" rel="stylesheet">
That will be a better solution.