0

我有一个包含多个表行的动态表单页面，用户通过选择要更新的行的复选框来更新状态。单击更新按钮时，我会打开一个 jquery 模式窗口，供用户从下拉列表中选择状态并输入注释。我能够通过 AJAX 将模式窗口数据传递给我的 servlet，但我不知道如何获取复选框值。

如何将父表单中的复选框值和模式窗口中的附加数据传递给我的 Java servlet，以便更新适当的数据库记录？我想使用 AJAX，这样父表单就不会为用户重新加载。

提前致谢！

模态窗口和 AJAX 更新：

$(function() {
    $("#dialog-form").dialog({
        autoOpen: false,
        height: 'auto',
        width: 'auto',
        modal: true,
        buttons: {
            "Update Status": function() {
                dataString = $("#statusForm").serialize();

                $.ajax({
                    type: 'POST',
                    url: 'updateStatus',
                    data: dataString,
                    dataType: 'json',
                    success: function(data) {alert(data);}
                });
                $(this).dialog("close");
            },
            Cancel: function() {$(this).dialog("close");}
        },
        close: function() {$(this).dialog("close");}
    });
    $("#update-status")
            .button()
            .click(function() {
        $("#dialog-form").dialog("open");
    });
});

编辑：

如您所见，在后台检查了 4 个项目，模式窗口位于顶部，要求提供更多信息。选择的项目需要使用模式窗口中的信息进行更新。每个复选框都有自己的唯一值，对应于它在数据库表中的记录 ID。

在此处输入图像描述

编辑2：

父表单 - HTML 代码片段：

<form name="OptionList">
<table id="statusTable">
    <thead>
        <tr>
            <th>Option</th>
            <th>Type</th>
            <th>Timestamp</th>
            <th>Entry Type</th>
            <th>User Profile</th>
        </tr>
    </thead>
    <tr>
        <td><input type="checkbox" value="19"></td>
        <td>DO</td>
        <td>5/14/13 4:31 PM</td>
        <td>A</td>
        <td>user profile</td>
    </tr>
    <tr>
        <td><input type="checkbox" value="61" ></td>
        <td>DO</td>
        <td>5/14/13 4:50 PM</td>
        <td>A</td>
        <td>user profile</td>
    </tr>
    <tr>
        <td><input type="checkbox" value="37"></td>
        <td>DO</td>
        <td>5/14/13 5:03 PM</td>
        <td>A</td>
        <td>user profile</td>
    </tr>
    <tr>
        <td><input type="checkbox" value="157"></td>
        <td>DO</td>
        <td>5/14/13 5:04 PM</td>
        <td>A</td>
        <td>user profile</td>
    </tr>
</table>

4

1 回答 1

1

您目前正在做的是将整个表单序列化并将其传递给您的 modal ：

dataString = $("#statusForm").serialize();

相反，您需要做的只是传递您感兴趣的行的数据。为此，您可以为每一行分配数字 ID，并解析具有该父 ID 的复选框的数据。

请参阅此解决方案：使用 ajax post 传递单元格值以更新表

于 2013-07-02T15:12:33.297 回答