What I want is to get row data when users click on the table's tbody but I keep getting undefined
for these datatables
functions.
我想要的是在用户单击表的tbody时获取行数据,但对于这些datatables函数,我一直没有定义。
Data comes from a node-mysql
module. And for testing purposes, after the table
is initialized and data's propertly arrived I've set:
数据来自一个节点-mysql模块。为了测试目的,在表初始化和数据正确到达之后,我已经设置了:
"fnDrawCallback" : function() {
console.log('this:' + this);
console.log('oTable.fnGetData():' + oTable.fnGetData());
console.log('JSON.stringify(oTable.fnGetData():' + JSON.stringify(oTable.fnGetData()));
console.log('JSON.stringify(oTable.fnGetData():' + JSON.stringify(oTable.fnGetData()[0]));
console.log('oTable.fnGetData()[0]:' + oTable.fnGetData()[0]);
},
The result is this:
结果是这样的:
this:[object Object] tables_offline.js:40
oTable.fnGetData():[object Object],[object Object],[object Object] tables_offline.js:41
JSON.stringify(oTable.fnGetData():[{"id":1,"age":"23","vol":26227,"tlg":4.93,"r":18.15},{"id":2,"age":"13","vol":6378,"tlg":3.97,"r":16.76},{"id":3,"age":"54","vol":131626,"tlg":6.49,"r":11.1}] tables_offline.js:42
JSON.stringify(oTable.fnGetData()[0]:{"id":1,"age":"23","vol":26227,"tlg":4.93,"r":18.15} tables_offline.js:43
oTable.fnGetData()[0]:[object Object]
It's not an array... Maybe this is the weird thing.
这不是一个数组…也许这是一件奇怪的事情。
I've tried debugging
with chrome
, setting
我试过用chrome调试,设置。
$('#myTable').on('click', 'tr', function(){
var oTable = $('#myTable').DataTable();
debugger;
});
And here's a screenshot of what's coming from the variable oTable
. I'm not sure but shouldn't I be able to see the functions
right there? I can't query something like oTable.fnGetData()
'cause it's undefined
.
Let me know if you need something else from my side in order for you to help me.
这是一个屏幕截图来自变量oTable。我不确定,但我能不能看到这里的函数?我不能查询像oTable.fnGetData()因为它是未定义的。如果你需要我的帮助,请告诉我。
EDIT
编辑
What I want basicaly is to get row data
when users click on the table's tbody
. I can't get there since oTable = $('#myTable').DataTable(); oTable.fnGetData()'
throws undefined.
当用户点击表的tbody时,我想要的是获取行数据。因为oTable = $('#myTable').DataTable();oTable.fnGetData()抛出未定义。
I'll try to clarify a bit more.
我想再澄清一点。
tables_offline.js
is the file that loads the datatable
, there I define my oTable
variable. While searching for help I came across this post (I'm using mData
for the columns definition) and I'm not sure if this is the case but it may help.
I make use of fnDrawCallback
just for testing oTable
in the console, it's not part of the original code.
tables_offline。js是加载datatable的文件,在那里我定义了oTable变量。在搜索帮助时,我发现了这个帖子(我正在使用mData作为列的定义),我不确定是不是这样,但它可能会有所帮助。我使用fnDrawCallback来测试控制台中的oTable,它不是原始代码的一部分。
var oTable = $("#myTable").dataTable({
'fnServerParams': function (aoData) {
aoData.push({ "name": "startDate", "value": startDate });
aoData.push({ "name": "endDate", "value": endDate });
},
'sAjaxSource': '/url',
'sAjaxDataProp': '',
'bProcessing': true,
'sDom':'t',
"aoColumns": [
{ "bVisible": false, "mDataProp": "pcrc_id"},
{ "sWidth": "25%","sTitle": "age", "mDataProp": "pcrc"},
{ "sWidth": "25%","sTitle": "Vol", "mDataProp": "volumen"},
{ "sWidth": "25%","sTitle": "tlg", "mDataProp": "tlg"},
{ "sWidth": "25%","sTitle": "r", "mDataProp": "reitero",
"mRender": function ( data, type, full ) {
return data + '%';
}
}
],
"oLanguage": {
"sUrl": "/javascripts/i18n/dataTables.Spanish.json"
},
"aaSorting": [[ 0, "desc" ]],
"bSort": false,
"bInfo" : false,
"bPaginate": false,
"fnDrawCallback" : function() {
console.log('this:' + this);
console.log('oTable.fnGetData():' + oTable.fnGetData());
console.log('JSON.stringify(oTable.fnGetData():' + JSON.stringify(oTable.fnGetData()));
console.log('JSON.stringify(oTable.fnGetData()[0]:' + JSON.stringify(oTable.fnGetData()[0]));
console.log('oTable.fnGetData()[0]:' + oTable.fnGetData()[0]);
},
"bFilter": false
});
EDIT 2
编辑2
New screenshot after accesing oTable
when a row's clicked. If I dig deep into context
I see the data but it's the full thing, not just the row clicked. I'd like to use a function to get clicked row data.
当一个行被点击时,新的屏幕截图。如果我深入到context中,我看到了数据,但它是完整的,而不仅仅是点击的行。我想使用一个函数来获得点击的行数据。
1 个解决方案
#1
0
Remove the fnDrawCallback stuff, I think it's distracting you from the actual problem.
删除fnDrawCallback的内容,我认为它会分散你对实际问题的注意力。
Try this:
试试这个:
var oTable = $("#myTable").dataTable({
'fnServerParams': function (aoData) {
aoData.push({ "name": "startDate", "value": startDate });
aoData.push({ "name": "endDate", "value": endDate });
},
'sAjaxSource': '/url',
'sAjaxDataProp': '',
'bProcessing': true,
'sDom':'t',
"aoColumns": [
{ "bVisible": false, "mDataProp": "pcrc_id"},
{ "sWidth": "25%","sTitle": "age", "mDataProp": "pcrc"},
{ "sWidth": "25%","sTitle": "Vol", "mDataProp": "volumen"},
{ "sWidth": "25%","sTitle": "tlg", "mDataProp": "tlg"},
{ "sWidth": "25%","sTitle": "r", "mDataProp": "reitero",
"mRender": function ( data, type, full ) {
return data + '%';
}
}
],
"oLanguage": {
"sUrl": "/javascripts/i18n/dataTables.Spanish.json"
},
"aaSorting": [[ 0, "desc" ]],
"bSort": false,
"bInfo" : false,
"bPaginate": false,
"bFilter": false
});
oTable.$('tr').click( function () {
var data = oTable.fnGetData( this );
console.log(data);
} );
Note that the oTable var is still in scope so you don't need to use var oTable = $('#myTable').DataTable()
.
注意,oTable var仍然在范围内,所以您不需要使用var oTable = $('#myTable'). datatable()。
This example is copied verbatim from the Datatables API documentation
这个例子是从Datatables API文档中逐字复制的。
#1
0
Remove the fnDrawCallback stuff, I think it's distracting you from the actual problem.
删除fnDrawCallback的内容,我认为它会分散你对实际问题的注意力。
Try this:
试试这个:
var oTable = $("#myTable").dataTable({
'fnServerParams': function (aoData) {
aoData.push({ "name": "startDate", "value": startDate });
aoData.push({ "name": "endDate", "value": endDate });
},
'sAjaxSource': '/url',
'sAjaxDataProp': '',
'bProcessing': true,
'sDom':'t',
"aoColumns": [
{ "bVisible": false, "mDataProp": "pcrc_id"},
{ "sWidth": "25%","sTitle": "age", "mDataProp": "pcrc"},
{ "sWidth": "25%","sTitle": "Vol", "mDataProp": "volumen"},
{ "sWidth": "25%","sTitle": "tlg", "mDataProp": "tlg"},
{ "sWidth": "25%","sTitle": "r", "mDataProp": "reitero",
"mRender": function ( data, type, full ) {
return data + '%';
}
}
],
"oLanguage": {
"sUrl": "/javascripts/i18n/dataTables.Spanish.json"
},
"aaSorting": [[ 0, "desc" ]],
"bSort": false,
"bInfo" : false,
"bPaginate": false,
"bFilter": false
});
oTable.$('tr').click( function () {
var data = oTable.fnGetData( this );
console.log(data);
} );
Note that the oTable var is still in scope so you don't need to use var oTable = $('#myTable').DataTable()
.
注意,oTable var仍然在范围内,所以您不需要使用var oTable = $('#myTable'). datatable()。
This example is copied verbatim from the Datatables API documentation
这个例子是从Datatables API文档中逐字复制的。