Как составить корректный ajax-запрос для записи в бд?

@web2k99 · Регистрация: 02.04.2019

Студворк — интернет-сервис помощи студентам

Помогите, пожалуйста, корректно подключить ajax к кнопке записи данных в бд. Есть таблица, в которую в цикле выводятся данные из бд. Вот код:

HTML5
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
<table class="table text-center">
                                            <thead class="text-uppercase">
                                            <tr>
                                                <th scope="col">ID</th>
                                                <th scope="col">Дата</th>
                                                <th scope="col">Метро</th>
                                                <th scope="col">Время</th>
                                                <th scope="col">Номер</th>
                                                <th scope="col">Фамилия</th>
                                                <th scope="col">Имя</th>
                                                <th scope="col">Отчество</th>
                                                <th scope="col">Сумма</th>
                                                <th scope="col">Комментарий</th>
                                                <th scope="col">Курьер</th>
                                                <th scope="col"> </th>
                                                <?php
                                                $post = get_delivery_users();
                                                ?>
                                                <?php foreach ($post as $users): ?>
                                            <form id="ajax-form">
                                            <tbody>
                                            <tr>
                                                <th scope="row"><input type="hidden" name="form_id" value="<?=$users['id']?>"></th>
                                                <td><div class="form-group">
                                                        <input class="form-control" type="date" name="delivery_date" value="<?=htmlspecialchars($users['delivery_date'], ENT_QUOTES)?>" id="example-date-input">
                                                    </div></td>
                                                <td><select name="delivery_adress" class="form-control">
                                                        <? foreach(get_delivery_addresses() as $delivery_address): ?>
                                                            <option <?if ($delivery_address == $users['delivery_adress']) echo ' selected'?>><?=htmlspecialchars($delivery_address, ENT_QUOTES)?></option>
                                                        <? endforeach;?>
                                                    </select></td>
 
                                                <td><input class="form-control" type="text" name="delivery_time" value="<?=htmlspecialchars($users['delivery_time'], ENT_QUOTES)?>" id="example-text-input"></td>
                                                <td><input class="form-control" type="text" name="phone" value="<?=htmlspecialchars($users['phone'], ENT_QUOTES)?>" id="example-text-input"></td>
                                                <td><input class="form-control" type="text" name="surname" value="<?=htmlspecialchars($users['surname'], ENT_QUOTES)?>"></td>
                                                <td><input class="form-control" type="text" name="name" value="<?=htmlspecialchars($users['name'], ENT_QUOTES)?>"></td>
                                                <td><input class="form-control" type="text" name="second_name" value="<?=htmlspecialchars($users['second_name'], ENT_QUOTES)?>"></td>
                                                <td><input class="form-control" type="text" name="sum" value="<?=htmlspecialchars($users['sum'], ENT_QUOTES)?>"></td>
                                                <td><input class="form-control" type="text" name="manager_comment" value="<?=htmlspecialchars($users['manager_comment'], ENT_QUOTES)?>"></td>
                                                <td><div class="form-group">
                                                        <select name="courier" class="form-control">
                                                            <? foreach(get_couriers() as $couriers): ?>
                                                                <option <?if ($couriers == $users['courier']) echo ' selected'?>><?=htmlspecialchars($couriers, ENT_QUOTES)?></option>
                                                            <? endforeach;?>
                                                        </select>
                                                    </div></td>
                                                <td><button type="submit" formmethod="post" name="couriers" id="pisos" class="btn btn-xs btn-warning mb-3">На доставку</button></td>
                                            </tr>
                                            </tbody>
                                            </form>
                                            <?php endforeach; ?>
                                        </table>

А вот код, который выполняется в courier.php:

PHP
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
<?php
 
require_once('db.php');
 
if(isset($_POST['couriers']))
{
    $form_id = (int)$_POST['form_id'];
    $sum = (int)$_POST['sum'];
    $manager_comment = strip_tags(trim($_POST['manager_comment']));
    $phone = strip_tags(trim($_POST['phone']));
    $name = strip_tags(trim($_POST['name']));
    $surname = strip_tags(trim($_POST['surname']));
    $second_name = strip_tags(trim($_POST['second_name']));
    $manager_comment = strip_tags(trim($_POST['manager_comment']));
    $delivery_adress = strip_tags(trim($_POST['delivery_adress']));
    $delivery_time = strip_tags(trim($_POST['delivery_time']));
    $delivery_date = strip_tags(trim($_POST['delivery_date']));
    $courier = strip_tags(trim($_POST['courier']));
    $SQL = "UPDATE Users SET phone='$phone', sum='$sum', name='$name', surname='$surname', second_name='$second_name', manager_comment='$manager_comment', delivery_adress='$delivery_adress', delivery_time='$delivery_time', delivery_date='$delivery_date', courier='$courier' WHERE id='$form_id'";
    $result = mysqli_query($link, $SQL);
 
    if ($result) {
        header('Location:delivery.php');
    }
    else {
        printf("Ошибка: %s\n", mysqli_error($link));
    }
}
?>

Помогите, пожалуйста, составить корректный ajax-запрос для записи в бд данных из таблицы. Я не понимаю, как это делать, если все данные в цикле, как и кнопки

Пытался сделать таким образом, алерт выходит, но в бд ничего не пишется...

JavaScript
1
2
3
4
5
6
7
8
9
10
11
12
$(document).ready(function() {
    $("#ajax-form").submit(function() {
        $.ajax({
            type: "POST",
            url: "courier.php",
            data: $(this).serialize()
        }).done(function() {
            alert("Данные сохранены");
        });
        return false;
    });
});

@sash23 · 02.04.2019, 19:10

вместо submit используйте событие клик для кнопок. внутри обработчика нужно извлечь все инпуты которые находятся в текущей строке таблицы и уже их отправлять. от формы вообще можно отказаться.

@web2k99 · 02.04.2019, 19:12 **[ТС]**

Сообщение от sash23

вместо submit используйте событие клик для кнопок. внутри обработчика нужно извлечь все инпуты которые находятся в текущей строке таблицы и уже их отправлять. от формы вообще можно отказаться.

Про submit - понял.
Можете подробнее на примере объяснить про то как мне извлечь инпуты? Я вот этого как раз не понимаю

@sash23 · 02.04.2019, 19:25

примерно так

JavaScript
1
2
3
4
5
6
7
8
$('button[name="couriers"]').on('click', function() {
  // текущая строка в таблице
  let $row = $(this).closest('tr');
  // находим инпуты и сериализуем их
  let data = $row.find('input').serialize();
  
  // далее можно отправлять ...
});

Добавлено через 1 минуту

PHP
1
if(isset($_POST['couriers']))

это убрать так как при сериализации кнопка не отправляется. можно так написать

PHP
1
if(isset($_POST['form_id']))

@web2k99 · 02.04.2019, 19:36 **[ТС]**

Сообщение от sash23

примерно так

JavaScript
1
2
3
4
5
6
7
8
$('button[name="couriers"]').on('click', function() {
  // текущая строка в таблице
  let $row = $(this).closest('tr');
  // находим инпуты и сериализуем их
  let data = $row.find('input').serialize();
  
  // далее можно отправлять ...
});

Добавлено через 1 минуту

PHP
1
if(isset($_POST['couriers']))

это убрать так как при сериализации кнопка не отправляется. можно так написать

PHP
1
if(isset($_POST['form_id']))

Хм, не подскажете, корректно ли я его составил?
IDE ругается на let data...

JavaScript
1
2
3
4
5
6
7
8
9
10
11
12
$('button[name="couriers"]').on('click', function() {
    let $row = $(this).closest('tr');
    let data = $row.find('input').serialize();
        $.ajax({
            type: "POST",
            url: "courier.php",
            data: $(this).serialize()
        }).done(function() {
            alert("Данные сохранены");
        });
        return false;
    });

@sash23 · 02.04.2019, 19:40

JavaScript
1
2
3
4
5
6
7
8
9
10
11
12
$('button[name="couriers"]').on('click', function() {
    let $row = $(this).closest('tr');
    let data = $row.find('input').serialize();
        $.ajax({
            type: "POST",
            url: "courier.php",
            data: data
        }).done(function() {
            alert("Данные сохранены");
        });
        return false;
    });

вроде так

Добавлено через 1 минуту
ide какая? какой версии?

@web2k99 · 02.04.2019, 19:42 **[ТС]**

Сообщение от sash23

JavaScript
1
2
3
4
5
6
7
8
9
10
11
12
$('button[name="couriers"]').on('click', function() {
    let $row = $(this).closest('tr');
    let data = $row.find('input').serialize();
        $.ajax({
            type: "POST",
            url: "courier.php",
            data: data
        }).done(function() {
            alert("Данные сохранены");
        });
        return false;
    });

вроде так

Добавлено через 1 минуту
ide какая? какой версии?

phpstorm 2018.3.5

@sash23 · 02.04.2019, 19:47

Сообщение от web2k99

phpstorm 2018.3.5

там где-то в настройках можно указать версию JS. либо если хотите вместо let можно писать var. но let правильнее.

@web2k99 · 02.04.2019, 19:49 **[ТС]**

Сообщение от sash23

там где-то в настройках можно указать версию JS. либо если хотите вместо let можно писать var. но let правильнее.

Сделал var data, теперь он пишет, что правильнее let data

В общем, проблема явно не в этом, т.к. алерт появляется, а в базу так ничего и не пишется

@sash23 · 02.04.2019, 19:53

в файле courier.php уберите редирект. и посмотрите через инструменты разработчика какой ответ выдает php. может там ошибка какая вылетает.

@web2k99 · 02.04.2019, 19:55 **[ТС]**

Сообщение от sash23

в файле courier.php уберите редирект. и посмотрите через инструменты разработчика какой ответ выдает php. может там ошибка какая вылетает.

Под редиректом вы имеете в виду это?

PHP
1
2
3
4
5
6
 if ($result) {
        header('Location:delivery.php');
    }
    else {
        printf("Ошибка: %s\n", mysqli_error($link));
    }

@sash23 · 02.04.2019, 19:56

ну пока закомментируйте header

@web2k99 · 02.04.2019, 20:04 **[ТС]**

Сообщение от sash23

ну пока закомментируйте header

Сделал. Эффект тот же - алерт + никаких изменений в бд.
В консоли вот что:
Одна непонятная мне ощибка Two touches at the same time? 135605782.719 vs 135607582.656
по php:
Request URL: http://baza/admin/courier.php
Request Method: POST
Status Code: 200 OK
Remote Address: 127.0.0.1:80
Referrer Policy: no-referrer-when-downgrade
onnection: Keep-Alive
Content-Length: 0
Content-Type: text/html; charset=UTF-8
Date: Tue, 02 Apr 2019 16:59:02 GMT
Keep-Alive: timeout=10, max=99
Server: Apache

@sash23 · 02.04.2019, 20:13

а это поменяли
if(isset($_POST['couriers']))
на form_id

@web2k99 · 02.04.2019, 20:14 **[ТС]**

Сообщение от sash23

а это поменяли
if(isset($_POST['couriers']))
на form_id

Да, конечно.

@sash23 · 02.04.2019, 20:19

выложите еще разок какой там js код который по кнопке запускается.

@web2k99 · 02.04.2019, 20:23 **[ТС]**

JavaScript
1
2
3
4
5
6
7
8
9
10
11
12
$('button[name="couriers"]').on('click', function() {
    let $row = $(this).closest('tr');
    let data = $row.find('input').serialize();
        $.ajax({
            type: "POST",
            url: "courier.php",
            data: $(this).serialize()
        }).done(function() {
            alert("Данные сохранены");
        });
        return false;
    });

@sash23 · 02.04.2019, 20:25

вместо data: $(this).serialize()
должно быть data: data

Добавлено через 34 секунды

JavaScript
1
2
3
4
5
6
7
8
9
10
11
12
$('button[name="couriers"]').on('click', function() {
    let $row = $(this).closest('tr');
    let data = $row.find('input').serialize();
        $.ajax({
            type: "POST",
            url: "courier.php",
            data: data
        }).done(function() {
            alert("Данные сохранены");
        });
        return false;
    });

@web2k99 · 02.04.2019, 20:30 **[ТС]**

Сообщение от sash23

вместо data: $(this).serialize()
должно быть data: data

Добавлено через 34 секунды

JavaScript
1
2
3
4
5
6
7
8
9
10
11
12
$('button[name="couriers"]').on('click', function() {
    let $row = $(this).closest('tr');
    let data = $row.find('input').serialize();
        $.ajax({
            type: "POST",
            url: "courier.php",
            data: data
        }).done(function() {
            alert("Данные сохранены");
        });
        return false;
    });

Хм, вот теперь получилось, но не до конца

Не пишутся данные из селектов delivery_adress и courier, точнее им присваиваются минимальные значения.

@sash23 · 02.04.2019, 20:34

а селекты я и не заметил тогда попробуем заменить строку

JavaScript
1
let data = $row.find('input').serialize();

на

JavaScript
1
let data = $row.find('input, select').serialize();

Новые блоги и статьи Все статьи Все блоги /
Семь CDC на одном интерфейсе: 5 U[S]ARTов, 1 CAN и 1 SSI Eddy_Em 18.02.2026 Постепенно допиливаю свою "многоинтерфейсную плату". Выглядит вот так: https:/ / www. cyberforum. ru/ blog_attachment. php?attachmentid=11617&stc=1&d=1771445347 Основана на STM32F303RBT6. На борту пять. . .	Символьное дифференцирование igorrr37 13.02.2026 / * Программа принимает математическое выражение в виде строки и выдаёт его производную в виде строки и вычисляет значение производной при заданном х Логарифм записывается как: (x-2)log(x^2+2) -. . .	Камера Toupcam IUA500KMA Eddy_Em 12.02.2026 Т. к. у всяких "хикроботов" слишком уж мелкий пиксель, для подсмотра в ESPriF они вообще плохо годятся: уже 14 величину можно рассмотреть еле-еле лишь на экспозициях под 3 секунды (а то и больше),. . .	И ясному Солнцу zbw 12.02.2026 И ясному Солнцу, и светлой Луне. В мире покоя нет и люди не могут жить в тишине. А жить им немного лет.
«Знание-Сила» zbw 12.02.2026 «Знание-Сила» «Время-Деньги» «Деньги -Пуля»	SDL3 для Web (WebAssembly): Подключение Box2D v3, физика и отрисовка коллайдеров 8Observer8 12.02.2026 Содержание блога Box2D - это библиотека для 2D физики для анимаций и игр. С её помощью можно определять были ли коллизии между конкретными объектами и вызывать обработчики событий столкновения. . . .	SDL3 для Web (WebAssembly): Загрузка PNG с прозрачным фоном с помощью SDL_LoadPNG (без SDL3_image) 8Observer8 11.02.2026 Содержание блога Библиотека SDL3 содержит встроенные инструменты для базовой работы с изображениями - без использования библиотеки SDL3_image. Пошагово создадим проект для загрузки изображения. . .	SDL3 для Web (WebAssembly): Загрузка PNG с прозрачным фоном с помощью SDL3_image 8Observer8 10.02.2026 Содержание блога Библиотека SDL3_image содержит инструменты для расширенной работы с изображениями. Пошагово создадим проект для загрузки изображения формата PNG с альфа-каналом (с прозрачным. . .

@sash23 563 / 410 / 259 Регистрация: 31.05.2016 Сообщений: 1,105
	02.04.2019, 19:10
	вместо submit используйте событие клик для кнопок. внутри обработчика нужно извлечь все инпуты которые находятся в текущей строке таблицы и уже их отправлять. от формы вообще можно отказаться. 0

@sash23 563 / 410 / 259 Регистрация: 31.05.2016 Сообщений: 1,105
	02.04.2019, 19:53
	в файле courier.php уберите редирект. и посмотрите через инструменты разработчика какой ответ выдает php. может там ошибка какая вылетает. 0

@sash23 563 / 410 / 259 Регистрация: 31.05.2016 Сообщений: 1,105
	02.04.2019, 19:56
	ну пока закомментируйте header 0

@sash23 563 / 410 / 259 Регистрация: 31.05.2016 Сообщений: 1,105
	02.04.2019, 20:13
	а это поменяли if(isset($_POST['couriers'])) на form_id 0

@sash23 563 / 410 / 259 Регистрация: 31.05.2016 Сообщений: 1,105
	02.04.2019, 20:19
	выложите еще разок какой там js код который по кнопке запускается. 0

Как составить корректный ajax-запрос для записи в бд?

Решение