Laravel 5.4 422 (Unprocessable Entity) Ajax-вызов - PullRequest
Новая
       14

Laravel 5.4 422 (Unprocessable Entity) Ajax-вызов

0 голосов
/ 09 октября 2018

Я пытаюсь сохранить комментарии и отобразить результат на той же странице с помощью вызова Ajax.Но я продолжаю получать эту ошибку в моей консоли

422 (Unprocessable Entity)

Давайте начнем с моей модели комментариев: 

class Comment extends Model
{
    // fields can be filled
    protected $fillable = ['body', 'user_id', 'image_request_id'];

    /**
     * Get the user that owns the Comment.
     */
    public function user()
    {
        return $this->belongsTo('App\User');
    }
}

Давайте продолжимс моей формой: 

{{ Form::open(['id' => 'storeComment', 'route' => ['comments.store'], 'method' => 'POST']) }}
{!! Form::textarea('body', null, ['class'=>'form-control', 'rows' => 3]) !!}
{!! Form::hidden('image_request_id', $imageRequest->id) !!}
{{ Form::submit('Add comment', array('class' => 'btn btn-success btn-lg btn-block')) }}
{{ Form::close() }}

Давайте рассмотрим метод контроллера: (CommentController.php) 

public function store(CommentRequest $request)
{
    $comment = Auth::user()->comments()->save(new Comment($request->all()));

    $response = array(
       'status' => 'success',
       'comment' => $comment
    );

    return response()->json($response);
}

Мой метод правил во мне CommentRequest.php 

/**
* Get the validation rules that apply to the request.
*
* @return array
*/
public function rules()
{
    return [
        'body' => 'required|max:1000',
    ];
}

Давайте посмотрим наш ajax.js 

$( document ).ready(function() {

        $('#storeComment').on('submit', function(e) {
            e.preventDefault();

            // Retrieve form data
            var formData = [];
            var data = $(this).serializeArray();
            $.each(data, function(index, field) {
                formData[field.name] = field.value;
            });

            // Post request with formData as data
            axios.post('/comments', formData).then(function(data) {
                console.log(data);
            });
        });
});

Когда я не использую ajax, все работает и данные сохраняются.

РЕДАКТИРОВАТЬ 1 console.log (data) до результата пост-запроса 

0: {name: "_token", value: "1DYMMAjNAv9TqOM4ZSu8JRlVpIeImmSDcmXP4Yu7"}
1: {name: "body", value: "blabla"}
2: {name: "image_request_id", value: "2"}

РЕДАКТИРОВАТЬ 2 Результаты console.log (formData) 

body: "blabla"
image_request_id: "2"
_token: "1DYMMAjNAv9TqOM4ZSu8JRlVpIeImmSDcmXP4Yu7"

РЕДАКТИРОВАТЬ 3 изображение ошибки

скриншот журнала ошибок в консоли

1 Ответ

0 голосов
/ 09 октября 2018

Я думаю, что проблема в неправильно названной переменной, это не temp, а formData, проверьте код ниже: 

    $( document ).ready(function() {
        $('#storeComment').on('submit', function(e) {
            e.preventDefault();

            // Retrieve form data
            var formData = {};
            var data = $(this).serializeArray();
            $.each(data, function(index, field) {
                formData[field.name] = field.value;
            });

            // Post request with temp as data
            axios.post('/comments', formData).then(function(data) {
                console.log(data);
            });
        });
   });
...