我想知道是否有人能指出我正确的方向。我有一个网页,其中包含下表:
**继续我的表*:*
<table id="staff" class="table">
<thead>
<tr>
<th>First Name</th>
<th>Last Name</th>
<th>Email Address</th>
<th></th>
</tr>
</thead>
<tbody>
<tr>
<td>
<input type="text" class="form-control input-lg" name="first_name" placeholder="First Name">
</td>
<td>
<input type="text" class="form-control input-lg" name="last_name" placeholder="Last Name">
</td>
<td>
<input type="text" class="form-control input-lg" name="email" placeholder="Email (Optional)">
</td>
<td><a href="#">save</a></td>
</tr>
</tbody>
<tfoot>
<tr>
<td colspan="4">
<button class="btn btn-block btn-primary btn-lg" id="addRow">Add Another Member</button><a href="addresident" class="pull-right" style="margin-top:10px;">Skip this step (Don't worry, you can add them later)</a></td>
</tr>
</tfoot>
</table>
这会产生1行,一旦用户输入了用户可以单击保存的信息,然后在表格下方就会出现一个用于添加新行的按钮。点击后,行immediatley出现在最后一行的下方,用户可以继续添加他们的员工。
我的问题是,哪种方法最适合将这些员工存储在数据库中?
这是我的jquery 我已经去了jquery,但这是来自另一个帖子,其中一些适用于生成新行,但输入错误。另外我对点击添加新成员后如何保存到数据库有点困惑..
<script>
function addTableRow(jQtable) {
var lastId = jQtable.find("tr:last td:first input").attr("data-id");
var newId = parseInt(lastId) + 1;
var row = $('<tr />');
for (var i = 0; i <= 2; i++) {
var thisId = newId + i;
var cell = $('<td />');
var input = $('<input type="text" class="form-control input-lg" data-id="' + thisId + '" />');
cell.append(input);
row.append(cell);
}
row.append('<td><a href="#">save</a></td>');
jQtable.append(row);
}
$('#addRow').click(function() {
addTableRow($('#mans'));
});
$(function () {
$('table').on('click', 'tr a', function (e) {
e.preventDefault();
$(this).parents('tr').remove();
});
});
</script>
答案 0 :(得分:0)
每次单击该按钮,您都会获得已输入的输入。然后使用AJAX请求将输入数据发送到服务器。在服务器端,您运行查询以将该数据添加到数据库。在客户端,您可以生成包含输入数据的表格行并插入。然后清除输入字段的值并重新开始。