Как я могу также сериализовать идентификаторы элементов внутри формы?

У меня есть форма, которая выглядит так (например, потому что люди могут сортировать и добавлять новые категории / вопросы):

<form id = "lijstform">
    <div class = "row">
        <div class = "col-md-8">
            <label class = "lijstnaamtitle">Lijst naam</label>
            <label class = "displaynonecoid" id = "coid">57</label>
            <input class = "form-control name_list catinput lijsttitle" type = "text" name = "lijsttitle">
        </div>
    </div>
    <div id = "dynamic_field" class = "ui-sortable">
        <div class = "row sortwrap ui-sortable-handle" id = "2-order">
            <div class = "col-md-8">
                <input type = "text" name = "category[]" placeholder = "2. Voeg een categorie toe" class = "form-control name_list catinput"> <i class = "mdi mdi-sort dragndrop"></i>
                <div class = "questionlist questionwrap">
                    <div class = "row">
                        <div class = "col-md-8">
                            <button class = "btn btn-success questionbutton">Extra vraag</button>
                            <input type = "text" name = "question[]" placeholder = "1. Voeg een vraag toe" class = "form-control name_list questioninput"> </div>
                        <div class = "col-md-4"> </div>
                    </div>
                </div>
            </div>
            <div class = "col-md-4">
                <button id = "addcategory" class = "btn btn-danger btn_remove removebutton">X</button>
            </div>
        </div>
        <div class = "row sortwrap ui-sortable-handle" id = "1-order" style = "">
            <div class = "col-md-8">
                <input type = "text" name = "category[]" placeholder = "1. Voeg een categorie toe" class = "form-control name_list catinput">
                <i class = "mdi mdi-sort dragndrop"></i>
                <div class = "questionlist questionwrap">
                    <div class = "row">
                        <div class = "col-md-8">
                            <button class = "btn btn-success questionbutton">Extra vraag</button>
                            <input type = "text" name = "question[]" placeholder = "1. Voeg een vraag toe" class = "form-control name_list questioninput">
                        </div>
                        <div class = "col-md-4">
                        </div>
                    </div>
                </div>
            </div>
            <div class = "col-md-4">
            </div>
        </div>
        <div class = "row sortwrap" id = "4-order" style = "">
            <div class = "col-md-8">
                <input type = "text" name = "category[]" placeholder = "4. Voeg een categorie toe" class = "form-control name_list catinput"> <i class = "mdi mdi-sort dragndrop"></i>
                <div class = "questionlist questionwrap">
                    <div class = "row">
                        <div class = "col-md-8">
                            <button class = "btn btn-success questionbutton">Extra vraag</button>
                            <input type = "text" name = "question[]" placeholder = "1. Voeg een vraag toe" class = "form-control name_list questioninput"> </div>
                        <div class = "col-md-4"> </div>
                    </div>
                </div>
            </div>
            <div class = "col-md-4">
                <button id = "addcategory" class = "btn btn-danger btn_remove removebutton">X</button>
            </div>
        </div>
        <div class = "row sortwrap" id = "3-order">
            <div class = "col-md-8">
                <input type = "text" name = "category[]" placeholder = "3. Voeg een categorie toe" class = "form-control name_list catinput"> <i class = "mdi mdi-sort dragndrop"></i>
                <div class = "questionlist questionwrap">
                    <div class = "row">
                        <div class = "col-md-8">
                            <button class = "btn btn-success questionbutton">Extra vraag</button>
                            <input type = "text" name = "question[]" placeholder = "1. Voeg een vraag toe" class = "form-control name_list questioninput"> </div>
                        <div class = "col-md-4"> </div>
                    </div>
                </div>
            </div>
            <div class = "col-md-4">
                <button id = "addcategory" class = "btn btn-danger btn_remove removebutton">X</button>
            </div>
        </div>
        <div class = "row sortwrap" id = "5-order">
            <div class = "col-md-8">
                <input type = "text" name = "category[]" placeholder = "5. Voeg een categorie toe" class = "form-control name_list catinput"> <i class = "mdi mdi-sort dragndrop"></i>
                <div class = "questionlist questionwrap">
                    <div class = "row">
                        <div class = "col-md-8">
                            <button class = "btn btn-success questionbutton">Extra vraag</button>
                            <input type = "text" name = "question[]" placeholder = "1. Voeg een vraag toe" class = "form-control name_list questioninput"> </div>
                        <div class = "col-md-4"> </div>
                    </div>
                </div>
            </div>
            <div class = "col-md-4">
                <button id = "addcategory" class = "btn btn-danger btn_remove removebutton">X</button>
            </div>
        </div>
    </div>
</form>

Вот как я сериализую форму и отправляю ее в свой PHP-скрипт:

$( ".lijstbutton" ).on( "click", function( event ) {
    event.preventDefault();
    // file that data is posted to:
    url = 'includes/createlist.php';
    // Serialized form
    $lijst = $( '#lijstform' ).serializeArray();
    // Id of company list is from
    $companyid = $( '#coid' ).text();
    // post the data
    var posting = $.post(url, {
      lijst: $lijst,
      companyid: $companyid
    });
    // show result in div
    posting.done(function( data ) {
     $( ".lijstresult" ).empty().slideDown('fast').append( data );
    });
  });

С помощью этой строки $lijst = $( '#lijstform' ).serializeArray(); вся форма сериализуется, но в ней нет идентификатора. Мне нужен идентификатор каждой категории, например id = "1-order".

Как я могу отправить эти идентификаторы в свой PHP-скрипт, чтобы сохранить их в своей таблице заказов (заказывать как в порядке сортировки, а не как в магазине)?

В тот момент, когда я публикую в своем PHP-скрипте и смотрю данные формы, это то, что я вижу на своей вкладке сети:

lijst[0][name]: lijsttitle
lijst[0][value]: Lijst titel
lijst[1][name]: category[]
lijst[1][value]: Category 1
lijst[2][name]: question[]
lijst[2][value]: Question 1
lijst[3][name]: question[]
lijst[3][value]: Question 2
lijst[4][name]: category[]
lijst[4][value]: Category 2
lijst[5][name]: question[]
lijst[5][value]: Question 1
lijst[6][name]: category[]
lijst[6][value]: Category 3
lijst[7][name]: question[]
lijst[7][value]: question 1
companyid: 57

Единственное, что публикуется, - это элементы формы. Поэтому, если вам нужно что-то опубликовать, поместите это в элемент формы.

Heretic Monkey 18.12.2018 15:10

@HereticMonkey Он уже заключен в тег формы.

twan 18.12.2018 15:12

Но ваш идентификатор находится на div, который не является элементом формы. Элементами формы являются input, select, button и т. д.

Heretic Monkey 18.12.2018 15:13

Просто добавьте скрытый ввод для каждого идентификатора

hindmost 18.12.2018 15:14
Поведение ключевого слова "this" в стрелочной функции в сравнении с нормальной функцией
Поведение ключевого слова "this" в стрелочной функции в сравнении с нормальной функцией
В JavaScript одним из самых запутанных понятий является поведение ключевого слова "this" в стрелочной и обычной функциях.
Концепция локализации и ее применение в приложениях React ⚡️
Концепция локализации и ее применение в приложениях React ⚡️
Локализация - это процесс адаптации приложения к различным языкам и культурным требованиям. Это позволяет пользователям получить опыт, соответствующий...
Улучшение производительности загрузки с помощью Google Tag Manager и атрибута Defer
Улучшение производительности загрузки с помощью Google Tag Manager и атрибута Defer
В настоящее время производительность загрузки веб-сайта имеет решающее значение не только для удобства пользователей, но и для ранжирования в...
Безумие обратных вызовов в javascript [JS]
Безумие обратных вызовов в javascript [JS]
Здравствуйте! Юный падаван 🚀. Присоединяйся ко мне, чтобы разобраться в одной из самых запутанных концепций, когда вы начинаете изучать мир...
Система управления парковками с использованием HTML, CSS и JavaScript
Система управления парковками с использованием HTML, CSS и JavaScript
Веб-сайт по управлению парковками был создан с использованием HTML, CSS и JavaScript. Это простой сайт, ничего вычурного. Основная цель -...
JavaScript Вопросы с множественным выбором и ответы
JavaScript Вопросы с множественным выбором и ответы
Если вы ищете платформу, которая предоставляет вам бесплатный тест JavaScript MCQ (Multiple Choice Questions With Answers) для оценки ваших знаний,...
0
4
37
0

Другие вопросы по теме