Блог

Главная - Вопросы по программированию - Отправка формы через Ajax — FormData и сериализация не работают

Отправка формы через Ajax — FormData и сериализация не работают

#jquery #ajax #serialization #form-data

#jquery #ajax #сериализация #форма-данные

Вопрос:

Я пытаюсь отправить форму с данными через ajax, но мой массив данных формы всегда пуст. Можете ли вы мне помочь. Я пробовал оба метода serialize и FormData, но оба пришли с пустым массивом в качестве ответа.

Код Jquery:

     $("#inschrijvencursus").submit(function(e) {
                        e.preventDefault();
                        var fd = $("#inschrijvencursus").serialize();
                        // var fd = new FormData(this);
                        $.ajax({
                            url: "/wp-content/themes/tweb/page-cursistenopgeven.php",
                            data: fd,
                            // cache: false,
                            // processData: false,
                            // contentType: false,
                            type: 'POST',
                            success: function (data) {
                                console.log(data);
                                $('#formdata').html(data);
                            }  
                        });

Форма:

 <form method="post" id="inschrijvencursus">
    <div class="form-group">
        <label for="company-name">Bedrijfsnaam</label>
        <input type="text" class="form-control" id="company" placeholder="Bedrijfsnaam">
    </div>
    <div class="form-group">
        <label for="name">Naam</label>
        <input type="text" class="form-control" id="name" placeholder="Naam">
    </div>
    <div class="form-check form-check-inline">
        <input class="form-check-input" type="checkbox" id="inlineCheckbox1" value="option1">
        <label class="form-check-label" for="inlineCheckbox1">Man</label>
    </div>
    <div class="form-check form-check-inline">
        <input class="form-check-input" type="checkbox" id="inlineCheckbox2" value="option2">
        <label class="form-check-label" for="inlineCheckbox2">Vrouw</label>
    </div>
    <div class="form-group">
        <label for="name">Telefoonnummer</label>
        <input type="tel" class="form-control" id="telephone" placeholder="Telefoonnummer">
    </div>
    <div class="form-group">
        <label for="name">Email</label>
        <input type="email" class="form-control" id="email" placeholder="Email">
    </div>
    <div class="form-group">
        <label for="exampleTextarea">Opmerkingen</label>
        <textarea class="form-control" id="opmerkingen" rows="3"></textarea>
    </div>
    <input type="submit" id="cursussubmit" class="nexttab"></button>
</form>

Комментарии:

1. Вывод HTML из PHP и JS выглядит нормально. Вы отладили PHP, чтобы посмотреть, что он получает?

2. На странице php я выполняю print_r($_POST); это выводит, что массив пуст. @RoryMcCrossan

3. Я только что узнал, что когда я console.log(fd) после функции сериализации, она пуста, поэтому fd не получает данные из формы как это возможно @RoryMcCrossan

4. У вас есть несколько элементов на странице с одинаковым inschrijvencursus идентификатором?

Ответ №1:

Только что нашел решение. При использовании функции сериализации входным элементам в вашей форме требуется name =»yourname» для отправки с помощью jquery для работы.

Метки: