2015-11-05 5 views
2

Моя форма проверки работает отлично, и это выглядит следующим образом:Laravel 5 Validation - класс ошибки в элементах формы

{!! Form::email('email', null, array('placeholder' => 'Email', 'class' => 'form-control ')) !!} 
{{$errors->first('email')}} 

Если письмо не хорошо, я получаю эту ошибку: The A Адрес электронной почты уже приняты ,

Дело в том, что я не буду размещать класс css на входе также как error, чтобы добавить красную границу фона на вход.

Как я могу это сделать?

+0

[введите описание ссылки здесь] (https://stackoverflow.com/questions/39637788/how-can -i-color-input-fields-border-red-when-i-get-validation-error-laravel-5-3/46314977 # 46314977) https://stackoverflow.com/questions/39637788/how-can-i -color-input-fields-border-red-when-i-get-validation-error-laravel-5-3/46314977 # 46314977 –

ответ

3

Это было правильный ответ для меня, без использования дополнительных div's:

{!! Form::email('email', null, $attributes = $errors->has('email') ? array('placeholder' => 'Email', 'class' => 'form-control has-error') : array('placeholder' => 'Email', 'class' => 'form-control')) !!} 
{{$errors->first('email')}} 
+0

Проблема на этом входе не принимает .has-error в Bootstrap. Это необходимо применить к родительскому div. В противном случае это было хорошим решением. – Dev

0

Добавить сообщение об ошибке

'custom' => array(
    'email' => array(
     'required' => 'We need to know your e-mail address!', 
    ), 
), 

Custom Error Messages in Laravel

+0

Мне не нужно специальное сообщение об ошибке. Мне нужен класс css, добавленный к моему вводу. – paulalexandru

+0

@paulalexandru [Проверить это] (http://stackoverflow.com/a/20352664/4595675) –

1

Вы можете просто добавить HTML вокруг него и стиль его же вы хотите.

HTML:

<span class="error">{{$errors->first('email')}}</span> 

CSS:

.error { 
    border: 1px solid red; 
} 

Edit: Добавить has-error класс к самому входу, как это:

{!! Form::email('email', null, array('placeholder' => 'Email', 'class' => 'form-control ' . $errors->first('email', 'has-error'))) !!} 
+0

Мне не нужен новый элемент. Мне нужен класс css, добавленный в мой ввод электронной почты. – paulalexandru

+0

Это очень простое решение. :) Проверьте мое редактирование. –

-1

добавить класс имеет-ошибку в форму например

{!! Form::email('email', null, array('placeholder' => 'Email', 'class' => 'form-control has-error')) !!} 

вы можете использовать, если условие, если есть ошибка, установите класс в

@if($errors->has('email')) 
    {!! Form::email('email', null, array('placeholder' => 'Email', 'class' => 'form-control has-error')) !!} 
@else 
    {!! Form::email('email', null, array('placeholder' => 'Email', 'class' => 'form-control')) !!} 
@endif 

или вы можете сделать, как это

<input class="form-control {{ $errors->has('email') ? 'has-error' : '' }}" name="email" placeholder="Email"> 
+0

Этот класс должен появиться только в том случае, если проверка формы не удалась, а не всегда, как вы это делали. – paulalexandru

+0

использовать, если условие для отслеживания сообщения об ошибке – yudijohn

+0

@paulalexandru проверить мой отредактированный код – yudijohn

7

You can use if condition for check errors:

<div class="form-group {{ $errors->has('email') ? 'has-error' :'' }}"> 
    {!! Form::text('email',null,['class'=>'form-control','placeholder'=>'Email Address']) !!} 
    {!! $errors->first('email','<span class="help-block">:message</span>') !!} 
</div> 
0
<script> 
    if({{$errors->has('email')}}){ 
    $(input[type="email"]).css('border-color', 'red'); 
    } 
</script> 
0

вы можете использовать следующий код, чтобы проверить, если адрес электронной почты поле имеет какую-либо ошибку проверки

<div class="form-group has-feedback @if($errors->has('email') has-error @endif"> 
     <input name="email" class="form-control"/> 
     <span class="glyphicon glyphicon-user form-control-feedback"></span> 
     @if ($errors->has('email')) <p class="help-block"><span class="glyphicon glyphicon-exclamation-sign" aria-hidden="true"></span> 
      {{ $errors->first('email') }}</p> 
     @endif 
    </div> 
Смежные вопросы