Передача массива данных из формы в ajax, в файл постов PHP

Question

Я постараюсь сохранить это коротким.У меня есть форма, поля ввода которой (54 из них) автоматически заполняются данными из базы данных.Идентификатор каждого поля ввода назначается с идентификатором с помощью цикла PHP while.Пользователь может редактировать значения и нажимать кнопку «Отправить».Когда форма отправляется, данные передаются в массив в jquery.Я хочу иметь возможность передавать этот массив из ajax в PHP через POST.

Форма / отправить страницу

$settings = array();
$counter = 0;

if(mysqli_num_rows($result) > 0){
    while($row = mysqli_fetch_assoc($result)) {
        $settings[$counter] = $row['value'];

        echo "<tr>
                <td>" . $row[$settings] . "</td>
                <td><input type=\"text\" id=\"" . $counter . "\" value=\"" 
                                 . $settings[$counter] . "\"></td>";
        counter++;
    }
}

mysqli_close($svr_link);

jQuery скрипт (внутри страницы формы / отправки)

    $('#update').click(function(event) {
    event.preventDefault();

    var settings = [];
    for (i=0; i<55; i++) {
        settings[i] = $('#' + i).val();
    }

    $.ajax({
        type: "POST",
        url: "pages/post.php",
        data: {settings:settings},
        success: function(data) {
            $('#message').html(data);
        }
    });
});

Мой вопрос:

1. Правильно ли я настроил этот массив данных в вызове ajax?

2. Как мне вытащитьи иметь дело с массивом данных в файле post.php?

Дайте мне знать, если я пропустил что-то важное

Answer 1

Добавьте name атрибут ко всем входным данным в виде массива

while($row = mysqli_fetch_assoc($result)) {
        $settings[$counter] = $row['value'];

        echo "<tr>
                <td>{$row[$settings]}</td>
                <td>
                    <input 
                        type=\"text\" 
                        id=\"{$counter}\" 
                        name=\"settings[{$counter}]\" 
                        value=\"{$settings[$counter]}\"
                        >
                </td>";
        counter++;
    }

Затем добавьте id к форме (если у вас нет тега формы, поместите идентификатор в некоторый HTMLэлемент, который содержит все входные данные, например, table), зависит от jQuery serializeArray()

let data = $('#formId').find(':input').serializeArray();

Итак, ваш код становится:

$('#update').click(function(event) {
    event.preventDefault();

    let data = $('#formId').find(':input').serializeArray();

    $.ajax({
        type: "POST",
        url: "pages/post.php",
        data: data,
        success: function(data) {
            $('#message').html(data);
        }
    });
});

jQuery.serializeArray ()

Кодировать набор элементов формы в виде массива имен и значений.

из документации jQuery.serializeArray ()

Answer 2

Если вы отправляете данные массива в формате JSON, рекомендуется установить dataType в настройке ajax на клиенте.

$.ajax({
    type: "POST",
    url: "pages/post.php",
    dataType: 'json',
    data: {settings:settings},
    success: function(data) {
        $('#message').html(data);
    }
});

На стороне сервера используйте функцию json_decode, чтобыполучить массив, чтобы вы могли легко работать с данными.Это было бы что-то вроде этого:

json_decode($_POST['settings'], true);