Question

我有一个动态表，其中select和input type="text"用于数据库中的每一行。如何设置attr "name"以便在服务器端正确读取select和input，以及如何使用ajax传递值？所有名称都应该是动态的，唯一的还是数组的......表格旁边的表格中有更多的输入，但我关心的只是表格数据。表是可排序的，因此行更改位置，序列化也会更改顺序。

<table id="config" class="table" cellspacing="0" width="100%">
    <thead>
        <tr>
            <th>name</th>
            <th>Action</th>
            <th class="no-sort">tag</th>
        </tr>
    </thead>
    <tbody>
        <tr>
            <td>Name 1</td>
            <td>
                <div class="form-group">
                    <select class="full-width config-action" name="action" data-init-plugin="select2" data-disable-search="true">
                        <option value="1">1</option>
                        <option value="2" selected>2</option>
                        <option value="3">3</option>
                        <option value="tag">Tag</option>
                    </select>
                </div>
            </td>
            <td>
                <input type="text" name="tag" class="form-control table-tag" >
            </td>
        </tr>
        <tr>
            <td>Name 2</td>
            <td>
                <div class="form-group">
                    <select class="full-width config-action" name="action" data-init-plugin="select2" data-disable-search="true">
                        <option value="1" selected>1</option>
                        <option value="2">2</option>
                        <option value="3">3</option>
                        <option value="tag">Tag</option>
                    </select>
                </div>
            </td>
            <td>
                <input type="text" name="tag" class="form-control table-tag" >
            </td>
        </tr>

    </tbody>
</table>

对于ajax，如果我序列化数据，如果表被排序，它们可以改变顺序，因此名称应该是动态的，但是如何在没有序列化的情况下处理它？</ p>

........
var form = $(this);
var action = form.attr('action');  

$.ajax({
    type: "POST",
    url: action,
    data: form.serialize(),
    success: function(response) {
        if(response === 'true') {

        }
        else {

            var msg = response;
        }
    }
});

Answer 1

可以在以这种方式提交表单之前动态添加“名称”属性：

$("input.table-tag").each(function(i){
   $(this).attr("name","tag"+i);
})

名称将变为tag0，tag1等。不确定这是否是必需的。

Answer 2

您的表单元素应在HTML中正确命名。

例如：

<select name="table[1][action]" ...
<input name=table[1][tag]" ...
...
<select name="table[2][action]" ...
<input name=table[2][tag]" ...

然后你会做这样的事情，假设你正在使用PHP：

foreach($_POST['table'] as $key => $row){
  // now use $key, $row['tag'], $row['action'] ...
}

$key变量通常是数据库ID。

处理html表

2 个答案: