Как сериализовать форму с атрибутами?
Разрабатываю сайт на php. В БД есть таблица со столбцами id и name. На php генерируется страничка с такой формой:
<form>
<select name="fruits">
<option db-id="1">Apple</option>
<option db-id="2">Orange</option>
<option db-id="3">Apple</option>
</select>
<input type="submit">
</form>Теперь нужно как-то сериализовать данную форму чтобы отправить аяксом на сервер. До этого использовал эту функцию:
$( "form" ).submit(function( event ) {
let formData = $("form").serializeArray();
// Отправка данных с помощью fetch или $.ajax
event.preventDefault();
});Но таким образом не сериализуются атрибуты db-id. id элемента нужен для апи для идентификации элемента.
Эта форма сделана для примера. Реальная форма горазда больше и писать свой сериализатор немного затратно.
Может есть еще какие-нибудь другие библиотеки кроме jquery, которые позволили бы сериализовать элементы формы вместе с аттрибутами? Или есть другой способ хранить id элемента - не в атрибуте и затем также просто собирать данные в один объект?
Страница для теста на plnkr.co.
У option должен быть обязательный атрибут value, он и передаёт значение:
$('form').submit(function(event) {
event.preventDefault();
console.log($(this).serialize());
// можно доставать значение и из атрибута, но такой подход в данном случае - "такое"
console.log($(this).find('select option:selected').attr('db-id'));
});<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<form>
<select name="fruits">
<option db-id="1" value="1" selected>Apple</option>
<option db-id="2" value="2">Orange</option>
<option db-id="3" value="3">Apple</option>
</select>
<input type="submit">
</form>
-
00:43
-
00:32
-
00:25
-
00:07
-
23:55
-
23:49
-
23:42
-
23:36
-
23:23
- Почему SERVER_ADDR имеет не тот IP 48030 visits
- Как заменить $_SERVER[REMOTE_ADDR] на IP клиента в PHP за двумя Nginx? 30576 visits
- Хочу вывести несколько строк из массива в один div, выводит только много undefined; подскажите, что делать? 23993 visits
- Как через css изменить цвет png изображения? 10422 visits
- Blob video url download 10015 visits
- Php curl запрос через прокси с авторизацией 9291 visits
- Работа с captcha vk api 8156 visits
© "hostciti.net" 13.4.2025 | 07:13