Use fnGetData w/Ajax data source
Use fnGetData w/Ajax data source
dsimmons
Posts: 7Questions: 0Answers: 0
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();
}
}