我在我的视图中动态构建了一个表,我使用jquery弹出模式对话框中的值填充了一个表。我想要完成的是获取行中的每个单元格并将其分配给变量,此时我将通过ajax调用将数据发布到数据库
我对JS和jnquery相当新,并且遵循了很多例子,我似乎无法想象将单元格值赋给变量,我已经包含了下面的代码。
这是表格的html
<div class="row">
<div class="col-md-12">
<table id="myTest" class="table table-responsive">
<thead>
<tr>
<th>Sku Number</th>
<th>Product Name</th>
<th style="width:300px">Description</th>
<th>Quantity</th>
<th>Border</th>
<th>Ink Color</th>
<th>Action</th>
</tr>
</thead>
<tbody>
</tbody>
</table>
<div style="padding:10px 0; text-align: right; ">
<input id="submit" type="button" value="Save Order" class="btn btn-warning" style="padding: 10px 20px; margin-right: 15px;" />
</div>
</div>
这是用于填充表格的JS
function addItem() {
var remove = $('<input type="button" id="remove" value="remove" style="width:80px" class="btn btn-danger" />');
var td = $("<td></td>");
td.append(remove);
var valid = true;
allFields.removeClass("ui-state-error");
if (valid) {
$("#myTest tbody").append(
"<tr>" +
"<td>" + skuNumber.val() + "</td>" +
"<td>" + productName.val() + "</td>" +
"<td>" + description.val() + "</td>" +
"<td>" + quantity.val() + "</td>" +
"<td>" + border.val() + "</td>" +
"<td>" + inkColor.val() + "</td>" +
"</tr>");
dialog.dialog("close");
$("#myTest > tbody tr:last").append(td);
//console.log(td);
}
return valid;
}
当你点击提交按钮时,我想创建一个包含表格中每一行的对象列表,这就是我遇到问题的地方。
$("#submit").click(function () {
var isAllValid = true;
var list = [];
$("#myTest tbody tr td")
.each(function(index, ele) {
var orderItem = {
SkuNumber: skuNumber.val(),
ProductName: productName.val(),
Description: description.val(),
Quantity: quantity.val(),
Border: border.val(),
InkColor: inkColor.val()
};
list.push(orderItem);
console.log(orderItem);
});