Laravel 5: Как отображать сообщение и перенаправлять после сообщения Ajax

Question

У меня есть простая страница блога, которая отправляет данные через ajax jquery. Он отлично работает, но на данный момент он возвращает ответ json после отправки.

Что мне нужно, это показать сообщение об успешном завершении пользователю на странице отправки, а затем перенаправить его на главную страницу статей.

Если я прокомментирую return Response::json($response); Я получаю пустую страницу, но я не хочу автоматически перенаправлять его на другой вид, я хочу показать ему сообщение в течение 5 секунд, а затем перенаправить его.

И $("#ajaxResponse").append(msg); ничего не делает.

Это мой контроллер

public function store(Requests\ArticleRequest $request) 
    { 

     $article = new Article($request->all()); 
     Auth::user()->articles()->save($article); 

     $response = array(
      'status' => 'success', 
      'msg' => 'Setting created successfully', 
     ); 

     return \Response::json($response); 
    } 

Это AJAX запрос

$(document).ready(function() { 
    $('#submit').on('submit', function (e) { 
     e.preventDefault(); 
     var title = $('#title').val(); 
     var body = $('#body').val(); 
     var published_at = $('#published_at').val(); 
     $.ajax({ 
      type: "POST", 
      url: host + '/articles/create', 
      data: {title: title, body: body, published_at: published_at}, 
      success: function(msg) { 
       $("#ajaxResponse").append(msg); 
      } 
     }); 
    }); 
}); 

И это мнение

<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css"> 

<h1>Write a New Article</h1> 

<hr> 

{!! Form::open(['url' => 'articles']) !!} 
    <p> 
     {!! Form::label('title', 'Title:') !!} 
     {!! Form::text('title') !!} 
    </p> 

    <p> 
     {!! Form::label('body', 'Body:') !!} 
     {!! Form::textarea('body') !!} 
    </p> 

    <p> 
     {!! Form::label('published_at', 'Date:') !!} 
     {!! Form::input('date', 'published_at', date('Y-m-d'), ['class' => 'form-control']) !!} 
    </p> 

    <p> 
     {!! Form::submit('Submit Article', ['id' => 'submit']) !!} 
    </p> 
{!! Form::close() !!} 

<h3 id="ajaxResponse"></h3> 

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

<script src="//code.jquery.com/jquery-1.11.0.min.js"></script> 
<script src="{{ URL::asset('assets/js/ArticleCreate.js') }}"></script> 

Answer 1

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

return \Response::json($response); 

в вашем JS

$(document).ready(function() { 
    $('#submit').on('submit', function (e) { 
    e.preventDefault(); 
    var title = $('#title').val(); 
    var body = $('#body').val(); 
    var published_at = $('#published_at').val(); 
    $.ajax({ 
     type: "POST", 
     url: host + '/articles/create', 
     data: {title: title, body: body, published_at: published_at}, 
     success: function(data) { 
      console.log(data); 
      if(data.status == 'success') { 
       alert(data.msg); 
       setInterval(function() { 
       alert("Hello"); 
       }, 3000); 

      }else{ 
       alert('error'); 
       console.log(msg); 
      } 
     } 
    }); 
    }); 
}); 

корректировать по мере необходимости, чтобы adpat к коду.

js fiddle example

$(document).ready(function() { 
    $('.alert-me').click(function() { 
    setInterval(function() { 
     alert("Hello"); 
    }, 3000); 
    }); 

});