frontend validate field

form.php

<?= $form->field(
  $model,
  'email',
  [
    'enableClientValidation' => false,
  ]
)->input(
  'email',
  [
    'validate_pattern'=>'^([a-z0-9_\.-])+@[a-z0-9-]+\.([a-z]{2,4}\.)?[a-z]{2,4}$',
    'validate_msg'=>'Must be like: mail@example.com'
  ]
) ?>

<?= Html::submitButton(
  'Send',
  [
    'class' => 'btn btn-success disabled'
  ]
) ?>

script.js

$('[validate_pattern]').focusout(function(){
  var pattern=new RegExp($(this).attr('validate_pattern'));
  var msg=$(this).attr('validate_msg');
  if ($(this).val().search(pattern) != 0) {
    $(this).parent().addClass('has-error');
    $(this).parent().removeClass('has-success');
    $('[type="submit"]').addClass('disabled');
    $(this).parent().find('.help-block.help-block-error').html(msg);
    return false;
  } else {
    $(this).parent().removeClass('has-error');
    $(this).parent().addClass('has-success');
    $(this).parent().find('.help-block.help-block-error').html('');
    return true;
  }
});

$('input,select').focusout(function(){
  if ($(this).closest('form').find('has-error').length == 0) {
    $('[type="submit"]').removeClass('disabled');
  }
});