Обновление строк таблицы в таблицах данных с помощью jquery

Question

Как я могу использовать jQuery ajax для обработки checked флажков?Как мне тогда отправить каждый checked флажок в таблице html на ajax.php?

Это то, что я пробовал до сих пор:

ajax.php

session_start();
if (isset($_POST['id']) && isset($_POST['to']) && isset($_SESSION['user']['id'])) {
    if (is_numeric($_POST['id']) && is_numeric($_POST['to'])) {
        include("mysql_connector.php");
        $user = $_SESSION['user']['id'];
        $sendTo = mysql_real_escape_string(trim($_POST['to']));
        foreach ($_POST['id'] as $id) {
            $id = mysql_real_escape_string(trim($id));
            mysql_query("UPDATE `email` SET status = '$sendTo' WHERE `email_id` = '$id' AND `userid` = '$user'");
        }
    }
}

Javascript:

$(".submit").click(function() {
    var id = $("#id").val();
    var to = $("#bins").val();
    var dataString = 'id=' + id + '&to=' + to;
    $.ajax({
        type: "POST",
        url: "ajax.php",
        data: dataString,
    });
});

html:

<form method="POST">
    <table id="inventory" class="table">
        <thead>
            <tr>
                <th style="text-align: center;"><a href="#" name="checkall" id="checkall" onclick="checkAll(this)" class="checkall">Check All</a></th>
                <th>Time Received</th>
                <th>Email</th>
                <th>Subject</th>
                <th>ID</th>
            </tr>
        </thead>
        <tbody>
            <tr class="email">
                <td style="text-align: center;"><input type="checkbox" name='msg[]' class="id" value="2" /></td>
                <td>1231231</td>
                <td>test</td>
                <td>test</td>
                <td>0</td>
            </tr>
            <tr class="email">

                <td style="text-align: center;"><input type="checkbox" name='msg[]' class="id" value="3" /></td>
                <td>1231231</td>
                <td>test</td>
                <td>test</td>
                <td>1</td>
            </tr>
        </tbody>

    </table>
    </br>
    <select name="bins" class="bins">
        <option value="1">Archive</option>
        <option value="2">Read</option>
        <option value="3">Unread</option>
        <option value="4">Save</option>
    </select>
    <input type="submit" name="move" value="Move" class="submit" style="width:auto;"/>
</form>

Спасибо за чтение.

Answer 1

Во-первых, недопустимо иметь несколько элементов dom с duplicate ids .Если эти флажки нуждаются в идентификаторах, сделайте их уникальными.Если им не нужны идентификаторы, просто отбросьте их полностью.

---

Чтобы получить список значений всех отмеченных флажков, выполните:

var checkedVals = [];
$("input[type='checkbox']:checked").each(function() {
    checkedVals.push($(this).val());
});

Или вы можете выбрать различные группы флажков по имени:

var checkedMsgVals = [];
$("input[name='msg[]']:checked").each(function() {
    checkedMsgVals.push($(this).val());
});

Чтобы отправить их в php, просто включите их в свой пакет данных, когда вы делаете вызов.Для этого вам нужно отправить объект, а не строку запроса.

var dataObj = {'id': id, 'to': to, 'checkedValues': checkedMsgVals };

$.ajax({
    type: "POST",
    url: "ajax.php",
    data: dataObj,
});