HTML:
<div class="tableStyle">
<table id="example" class="display" cellspacing="0" width="100%">
<thead>
<h2 style="text-align: center;">SAMPLE</h2>
<tr>
<th>Commands</th>
<th>ID</th>
<th>Type</th>
<th>Name</th>
<th>PPU</th>
<th>$ Amount</th>
</tr>
</thead>
</table>
</div>
JS
$("#dialog").dialog({
autoOpen: false,
draggable: false,
resizeable: false,
height: 'auto',
width: 'auto',
buttons: {
Cancel: function() {
$( this ).dialog( "close" );
},
Save: function() {
$ (this).dialog("close");
}
}
});
$.ajax({
url: 'data.json',
success: function(data) {
var table = $('#example').DataTable({
data: data,
"pagingType": "numbers",
'searchable': true,
'sort': true,
columns: [
{data: null,
defaultContent: "<button id='edit'>Edit</button> <button id='delete'>Delete</button>"
},
{ data : 'id' },
{ data : 'type' },
{ data : 'name' },
{ data : 'ppu' },
{ data : 'amount',
render: function(amount) {
return '$' + amount;
}}
]
})
$('#example tbody').on( 'click', 'tr #edit', function () {
var data = table.row(this).data();
console.log(data);
$('#dialog h1').html("Title");
$('#dialog').dialog('open');
});
$('#example tbody').on( 'click', '#delete', function () {
alert('Delete this!');
});
}
})
所以我想要实现的只是从按钮点击的相关行中获取数据。我尝试了几乎所有的东西,每次尝试它都是未定义的。我还在处理我的代码,但这是我需要的下一部分才能继续。我尝试使用var data = table.row(this).data();
每次返回undefined。我需要通过单击特定的取消按钮来关联行对象。单击按钮后,我将打开一个对话框,显示该对象和相关行的某些信息。如果有人可以提供帮助,那将会有很大的帮助。
感谢
答案 0 :(得分:0)
我用table.row(this).data()错误解决了这个问题,首先找到我正在使用哪一行的索引,然后通过相同的函数传递索引。
var index = $(this).closest('tr').index()
var data = table.row(index).data();
这似乎是解决这个问题的最简单方法。