0

I have this code below, if a user is not authenticated it appears this "Login" link:

 @if(!\Auth::check())
    <span><a id="show_login_modal" href="javascript:void(0)">Login</a>
    </span>
@endif

If the user logins with success the modal close and the user is loged in. Its working fine.

But if there is a validation error, for example if password is inscorrect, the modal is closed the user is not loged in and no error message appears. For the validaiton message appear is necessary to click in "login" to open again the modal and it apperas "These credentials do not match our records."

Do you know how to if there is a validation error open the modal without be necessary to click in "login"?

jQuery:

$('#show_login_modal').click(function(){
    $('#login_modal').modal('show');
})

$('#close_login_modal').click(function(){
    $('#login_modal').modal('hide');
})

Modal:

<div class="modal fade" id="login_modal" tabindex="-1" role="dialog" aria-labelledby="myLargeModalLabel" aria-hidden="true">
  <div class="modal-dialog modal-sm">
    <div class="modal-content">
      <div class="modal-header">
        <h5 class="modal-title" id="exampleModalLabel">Login</h5>
        <button type="button" class="close">
          <span aria-hidden="true">&times;</span>
        </button>
      </div>
      <div class="modal-body">
        <div class="container">
          <div class="row">
            @include('includes.errors')
            <form class="clearfix" method="POST" action="{{ route('login') }}">
              {{ csrf_field() }}
              <div class="form-group col-12 px-0">
                <label for="inputEmail4">Email</label>
                <input type="email" class="form-control" value="{{ old('email') }}" name="email" required autofocus placeholder="Email">
              </div>
              <div class="form-group col-12 px-0">
                <label for="inputEmail4">Password
                  <a href="{{ route('password.request') }}" class="text-gray ml-1" style="text-decoration: underline">
                    <small>Recover password</small></a> </label>
                <input type="password" class="form-control" name="password" required placeholder="Palavra-passe">
              </div>
              <button type="submit" class="btn btn-primary btn d-block w-100">Login</button>
            </form>
          </div>
        </div>
      </div>
      <div class="modal-footer">
        <button type="button" id="close_login_modal" class="btn btn-primary" data-dismiss="modal">Close</button>
      </div>
    </div>
  </div>
</div>

errors.blade.php

@if ($errors->any())

     <ul>
        @foreach ($errors->all() as $error)
            <li>{{ $error }}</li>
        @endforeach
     </ul>

@endif
8
  • You should use ajax, when you posting with php it refreshes the page anyway Apr 15, 2018 at 15:24
  • Thanks, but it dont works also with something like "@if ($errors->any()) alert("test"); $('#login_modal').on('show.bs.modal', function (){}) @endif"? Like this is not working, the alert shows but the modal dont open.
    – johnW
    Apr 15, 2018 at 15:39
  • You can get the errors via javascript too with yourResponse.responseJSON. Anyways if you wish to do the click action you can simply just trigger a click like this $('#yourElement').trigger('click') Apr 15, 2018 at 15:43
  • In your case it would be $('#show_login_modal').trigger('click') I guess. Apr 15, 2018 at 15:44
  • Thanks but also dont works with "@if ($errors->any()) alert("test"); $('#show_login_modal').trigger('click'); @endif ". But the alert works.
    – johnW
    Apr 15, 2018 at 15:45

0

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Browse other questions tagged or ask your own question.