Поставьте запрос на проблему с FormData API и Ajax

Question

Я пытаюсь отправить атрибуты формы на сервер с помощью FormData Api, но я получаю 422 кода ответа от сервера.В противном случае тот же код прекрасно работает с запросом публикации на другой странице.

Из-за этого я удалил значения contentType, processData в моем коде и, используя метод Jquery serializeArray (), теперь работает.Мой вопрос: почему не работает первый стиль моего кода?

//Update Episode Button
        var updateEpisodeButton = document.getElementById('updateEpisode');

        updateEpisodeButton.onclick = function(e) {
            var formData = new FormData(document.getElementById('editEpisodeForm'));
            var isFormValid = document.getElementById('editEpisodeForm').checkValidity();
            formData.append('description', editor.getData());
            console.log(editor.getData());
            console.log(formData);
            if (isFormValid) {
                e.preventDefault();
                $.ajax({
                    url:"{{route('podcast.episode.update',[$podcast->slug,$episode->slug])}}",
                    dataType:'JSON',
                    type:'PUT',
                    contentType: false,
                    processData: false,
                    headers: {
                    'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
                    },
                    data:formData,
                    success:function(result){
                        swal({
                                type: 'success',
                                title: 'Episode Created!',
                        });
                    },
                    error:function(result){
                        var $data=jQuery.parseJSON(result.responseText);
                        $errors="";

                        if (result.status=='422')
                        {
                            Object.keys($data.errors).forEach(key => {
                                $data.errors[key].forEach(errorMessage => {
                                    $errors+=errorMessage+'<br>';
                                });
                            });

                            swal({
                                type: 'error',
                                title: 'Oops...',
                                html:$errors
                            });
                        }
                    },
                });
            }

        }

<form action="" method="POST" id="editEpisodeForm">
                <div class="col-md-4"></div>
                <div class="col-md-8 float-right">
                    <div class="form-group">
                        <label class="font-weight-bold" for="title">Title :</label>
                        <input type="text" class="form-control" required name="title" value="{{$episode->title}}" placeholder="Type episode title..." id="title">
                    </div>
                    <div class="form-group">
                        <label class="font-weight-bold" for="subtitle">Subtitle :</label>
                        <input type="text" class="form-control" required name="subtitle" value="{{$episode->subtitle}}" placeholder="Type episode subtitle..." id="subtitle">
                        <small class="form-text text-muted">This section is optinal*</small>
                    </div>
                    <div class="form-group">
                        <label class="font-weight-bold" for="description">Description :</label>
                        <textarea id='editor' name="description" rows="10" cols="20">{{$episode->description}}</textarea>
                    </div>
                    <div class="form-group">
                        <label for="explicit">Explicit :</label>
                        <input type="radio" required name="explicit" value="1"> Yes
                        <input type="radio" required checked name="explicit" value="0"> No
                    </div>
                    <div class="form-group text-center">
                        <button type="submit" class="btn btn-success" id="updateEpisode">Update episode</button>
                    </div>
                </div>
            </form>

Полезная нагрузка в стиле FormData

Полезная нагрузка в стиле serializeArray