Use fnGetData w/Ajax data source
Use fnGetData w/Ajax data source

The example in the documentation to get TR data when clicked works perfectly using DOM data source, but fails to get row data when using Ajax data source. Should oTable.$('tr').click function be inside fnInitComplete function, and if so, how to make it work?
The example says:
// Row data
$(document).ready(function() {
oTable = $('#example').dataTable();
oTable.$('tr').click( function () {
var data = oTable.fnGetData( this );
// ... do something with the array / object of data for the row
} );
} );
The example says:
// Row data
$(document).ready(function() {
oTable = $('#example').dataTable();
oTable.$('tr').click( function () {
var data = oTable.fnGetData( this );
// ... do something with the array / object of data for the row
} );
} );
This discussion has been closed.
Replies
Basically you want to use:
[code]
$('#example').on( 'click', 'tr', function () {
...
} );
[/code]
Allan
Here is what I currently have. When I click on a TR in the table, the error is "aoData is null or not an object." I'm trying to populate a form on the same page when the user clicks a row in the table. I suspect with this configuration that an object is being returned for the row, not an array, and I'm not sure how to get to the data for each column. --- Denise
$(document).ready(function() {
oTable = $("#QuestionsList").dataTable({
"bRetrieve":true,
"bDestroy":true,
"bJQueryUI": true,
"bProcessing": true,
"sDom": "t<'F'ip>",
"sAjaxSource": 'lists/getQuestionsList.asp?action=loadEditJSON',
"sScrollY": $(window).height() / 2,
"bPaginate": false,
"aaSorting": [],
"aoColumnDefs": [
{"aTargets":[0], "mData":"QUESTION_ID"},
{"aTargets":[1], "mData":"QUESTION_DESC"},
{"aTargets":[2], "mData":"QUESTION_DETAIL", "bSortable":false},
{"aTargets":[3], "mData":"TXT_EDIT_FLG"},
{"aTargets":[4], "mData":"CREATED_BY"},
{"aTargets":[5], "mData":"CREATED_DT"},
{"aTargets":[6], "mData":"MODIFIED_BY"},
{"aTargets":[7], "mData":"MODIFIED_DT"}
],
"fnInitComplete": function(oSettings, json) {
alert('DataTables has finished initialization.');
},
"fnDrawCallback": function(oSettings) {
alert('DataTables has redrawn the table');
$("#QuestionsList").on('click', 'tr', function(event) {
loadDialogForm(this);
})
}
});
Allan
---INITIALIZATION---
oTable = $("#QuestionsList").dataTable({
"bRetrieve":true,
"bDestroy":true,
"bJQueryUI": true,
"bProcessing": true,
"sDom": "t<'F'ip>",
"sAjaxSource": 'lists/getQuestionsList.asp?action=loadEditJSON',
"sScrollY": $(window).height() / 2,
"bPaginate": false,
"aaSorting": [],
"aoColumnDefs": [
{"aTargets":[0], "mData":"QUESTION_ID"},
{"aTargets":[1], "mData":"QUESTION_DESC"},
{"aTargets":[2], "mData":"QUESTION_DETAIL", "bSortable":false},
{"aTargets":[3], "mData":"TXT_EDIT_FLG"},
{"aTargets":[4], "mData":"CREATED_BY"},
{"aTargets":[5], "mData":"CREATED_DT"},
{"aTargets":[6], "mData":"MODIFIED_BY"},
{"aTargets":[7], "mData":"MODIFIED_DT"}
],
"fnInitComplete": function(oSettings, json) {
//alert('DataTables has finished initialization.');
},
"fnDrawCallback": function(oSettings) {
$("#QuestionsList tbody tr").on('click', function() {
var aRow = this;
loadQuestionDialogForm(aRow);
})
}
});
---FUNCTION---
function loadQuestionDialogForm(aRow) {
var trData = $("#QuestionsList").dataTable().fnGetData(aRow);
if (trData["TXT_EDIT_FLG"] == "N") {
alert("Edit not permitted for Question ID " + trData["QUESTION_ID"]);
}
else {
$("#question_id").val(trData["QUESTION_ID"]);
$("#question_desc").val(trData["QUESTION_DESC"]);
$("#question_detail").val(trData["QUESTION_DETAIL"]);
$('#QUESTION_FORM_AREA').dialog("open");
$("#question_desc").focus();
}
}