jQuery表单数据传递为空

Question

I have an ajax call, Where on the submit button click the ajax call initiates

<form id="editPet" method="patch" enctype="multipart/form-data">

    inputs...

    <button id="updatePet" data-id="{{ $pet->uuid }}" data-token="{{ csrf_token() }}" type="button">SAVE</button>
</form>

Ajax call :

$('#updatePet').click(function(e) {
    e.preventDefault();
    let petId = $(this).data("id");
    $.ajaxSetup({ headers: {'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')}});
    $.ajax({
        url: "/my/pet/update/" + petId,
        type: "patch",
        data: new FormData($("#editPet")[0]),
        cache: false,
        contentType: false,
        processData: false,
        success: function(response) {
            // Do something
        },
        error: function(error) {
            // Do something
        }
    });
});

On the server side i am getting the request with dd($request->all()) which is empty array.

What am i missing here ?

Answer 1

The issue is solved by removing :

contentType: false,
processData: false,

As @Taplar mentioned in the comment,

"By default, data passed in to the data option as an object (technically, anything other than a string) will be processed and transformed into a query string, fitting to the default content-type "application/x-www-form-urlencoded"