How to customize validation error message to display on tooltip in Yii2?

Question

I am using ActiveForm of yii2 and I want to customize the validation errors. I want to display errors on tooltip.

This is my form

<?= $form = ActiveForm::begin(['id' => 'login-form','method'=>'post']); ?>
    <?= 
        $form->field($model, 'email')
            ->textInput([
                'class'=>'form-control login_email',
                'placeholder'=>'Email'
                /*'onfocus'=>"this.value = '';",
                "onblur"=>"if (this.value == '') {
                    this.value = 'Email';
                }"*/
            ])
            ->label(false);
    ?>
    <?= 
        $form->field($model, 'password')
            ->passwordInput([
                'class'=>'form-control',
                'placeholder'=>'Password'
            ])
            ->label(false);
    ?>
    <input type="text" name="hidden" value="login" hidden="true">
    <p class="forgot">
        <a href="<?= Yii::$app->urlManager->createUrl(['site/request-password-reset']); ?>">
            Forgot Password?
        </a>
    </p>

    <div class="form-group">
        <?= Html::submitButton('Log In', ['class' => 'sign-in','name' => 'login-button']) ?>
    </div>
<?php ActiveForm::end(); ?>

Please tell me if anyone has idea about this.

Answer 1

Update error message in form template like below

  $form = ActiveForm::begin([
  'id' => 'login-form',
  'options' => ['enctype' => 'multipart/form-data'],
   'fieldConfig' => ['template' => "<div class=\"input-cover\"><div class=\"tooltip\">{error}</div>\n{label}\n{input}</div>",
  'inputOptions' => ['class' => 'input-control'],
                    ],
          ]);