Данные POST не отправляются через Ajax в laravel

Question

Я отправляю запрос через ajax. Я на самом деле пытаюсь получить электронное письмо, когда пользователи отправляют контактную форму. У меня нет тега <form></form>, и я использовал идентификатор каждого поля для сбора данных.

У меня есть следующий код в HTML:

<div class="row">
<div class="col-lg-10 offset-lg-1 col-md-10 offset-md-1 col-sm-12 col-12 c-2">
    <div class="question-form-area">
        <div class="cf-msg" style="display: none;"></div>
        <div class="row">
            <div class="col-md-12">
                <div class="form-group">
                    <label class="mb-0">My Fullname is</label>
                    <input type="text" id="name" class="form-control mt-2" placeholder="Name" required="required">
                    <p class="help-block text-danger"></p>
                </div>
            </div>
            <div class="col-md-12">
                <div class="form-group">
                    <label class="mb-0">My valid email is</label>
                    <input type="email" id="email" class="form-control mt-2" placeholder="Email" required="required">
                    <p class="help-block text-danger"></p>
                </div>
            </div>
            <div class="col-md-12">
                <div class="form-group">
                    <label class="mb-0">My location</label>
                    <input type="text" id="location" class="form-control mt-2 project" placeholder="Personal address" required="required">
                    <p class="help-block text-danger"></p>
                </div>
            </div>
            <div class="col-md-12">
                <div class="form-group">
                    <label>I want</label>
                    <select class="form-control project" id="service">
                        <option value="Ecommerce websites">E-commerce Website</option>
                        <option value="Mobile App">E-commerce Website</option>
                        <option value="Website and Mobile App">Website and Mobile App</option>
                        <option value="WordPress Static Website">WordPress Static Website</option>
                        <option value="WordPress E-Commerce Website">WordPress E-Commerce Website</option>
                        <option value="WordPress Other Website">WordPress Other Website</option>
                        <option value="I don't know much but I need a website">I don't know much but I need a website</option>
                    </select>
                    <p class="help-block text-danger"></p>
                </div>
            </div>
        </div>

        <div class="form-group">
            <label>I want following pages on my website</label>
            <br>
            <input class="clientcheck" type="checkbox" name="webpages[]" value="Home page">Home page
            <input type="checkbox" class="webpages" name="webpages[]" value="About page">About page
            <input type="checkbox" class="webpages" name="webpages[]" value="Products/Services Page">Products/Services
            <input type="checkbox" class="webpages" name="webpages[]" value="Business Contact Page">Business Contact
            <input type="checkbox" class="webpages" name="webpages[]" value="Enquiry Form">Enquiry Form
            <input type="checkbox" class="webpages" name="webpages[]" value="Some additional pages">Some additional pages
            <p class="help-block text-danger"></p>
        </div>

        <div class="form-group">
            <label>I want following features</label>
            <br>
            <input class="clientcheck" type="checkbox" name="payment[]" value="Receive PayPal payment">Receive PayPal payment
            <input type="checkbox" class="payment" name="payment[]" value="Only Card Payment(no PayPal)">Only Card Payment(no PayPal)
            <input type="checkbox" class="payment" name="payment[]" value="Both PayPal and Card Payment">Both PayPal and Card Payment
            <input type="checkbox" class="payment" name="paymefeaturesnt[]" value="Live Chat">Live Chat
            <input type="checkbox" class="payment" name="payment[]" value="Logo designed by BeOnWeb">Logo designed by BeOnWeb
            <input type="checkbox" class="payment" name="payment[]" value="Inventory Management">Inventory Management
            <p class="help-block text-danger"></p>
        </div>

        <div class="form-group">
            <label>Website updates</label>
            <select class="form-control project" name="website_update" id="website_update">
                <option value="I will update it myself">I will update it myself</option>
                <option value="I want BeOnWeb to update my website">I want BeOnWeb to update my website</option>
            </select>
        </div>

        <div class="form-group">
            <label>My budget is</label>
            <input type="text" name="budget" id="budget" class="form-control project">
        </div>

        <div class="form-group">
            <label>I want my website to be ready by</label>
            <input type="date" name="completion_date" id="completion_date" class="form-control project">
        </div>

        <div class="form-group">
            <label>Contact date and time</label>
            <input type="text" name="date_time" id="date_time" class="form-control project">
        </div>

        <div class="form-group">
            <label>Name of my company</label>
            <input type="text" name="company_name" id="company_name" class="form-control project" placeholder="Business name">
        </div>

        <div class="form-group">
            <label>My company address is</label>
            <input type="text" name="company_address" id="company_address" placeholder="company address" class="form-control project">
        </div>

        <div id="success"></div>
        <div class=" text-center">
            <button type="submit" class="btn" id="contactSubmit">Submit</button>
        </div>

    </div>
</div>

У меня есть следующий код на ajax:

$('#contactSubmit').on('click', function() {
    var form_result_div = '#form-result';
    $(form_result_div).remove();
    $('button').replaceWith('<a class="btn btn-dark btn-theme-colored" disabled id="contactSubmit">Loading...</a>');
    let name = $('#name').val();
    let email = $('#email').val();
    let location = $('#location').val();
    let service = $('#service option:selected').val();
    let web_pages = $('.webpages:checked').map(function(){
        return this.value;
    }).get();
    let payment = $(".payment:checked").map(function () {
            return this.value;
        }).get();
    let website_update = $('#website_update option:selected').val();
    let budget = $('#budget').val('');
    let completion_date = $('#completion_date').val('');
    let date_time = $('#date_time').val('');
    let company_name = $('#company_name').val('');
    let company_address = $('#company_address').val('');
    $.ajax({
        method: "POST",
        url: "{{ route('contact_form') }}",
        dataType: 'json',
        data: { _token:"{{ csrf_token() }}",name:name,email:email,location:location, service: service, budget: budget, completion_date: completion_date, date_time: date_time, company_name: company_name, company_address: company_address, payment:payment, web_pages: web_pages, website_update: website_update},
        success: function(response) {
          $('#name').val('');
              $('#email').val('');
              $('#location').val('');
              $('.clientcheck').prop('checked', false);
              $('#service option:selected').val('');
              $('#website_update option:selected').val('');
              $('#budget').val('');
              $('#completion_date').val('');
              $('#date_time').val('');
              $('#company_name').val('');
              $('#company_address').val('');
              $('button').replaceWith('<a class="btn btn-dark btn-theme-colored" href="/">Return home</a>');
        }

      });
});

Но, когда я отправляю форму и выполняю dd($request) в контроллере, параметр запроса будет пустым. Я ожидаю получить массив данных, отправленных через контактную форму. Что нужно добавить в код, чтобы он заработал? Я обнаружил, что добавление contentType: "application/x-www-form-urlencoded", на ajax будет работать и сработало для многих людей, но я не могу сказать, что это беспокоило меня. Любая помощь будет оценена.