Datatable inside Fancybox

smsorensen

I am attempting to use the dataTables plug-in inside the Fancybox plugin. Populating the data is working fine, but I have lost the sorting and pagination events (even though the close button works).

smsorensen

[code] ...

// add default and custom configutarion to history table
dataTablesConfigTwo["aoColumns"] = [
{ "sType" : "html" },
null,
null,
null,
null,
null,
null,
null
];

historyTable = $('#history-table').dataTable( dataTablesConfig );


// Get History
function showHistory(projectId){
$.ajax({type: "POST",
url: "<%=URLs.getStatusReportHistoryURL()%>",
data: ( { project_id : projectId }),
error: function (xml, status, errorThrown) { processAjaxError(xml, status, errorThrown); },
success: function (xml) { processGetReportHistory(xml); },
dataType: "xml"
});
};

function processGetReportHistory(xml){
hideUserFeedbackMessages();

var hasError = false;

var status = $(xml).find('status').text();


if ( status == "fail" ){
hasError = true;
var msg = "Sorry! Unable to retrieve the project's history. Please try again.";
noteError(msg);
};

if ( !hasError ){

historyTable.fnClearTable();

$(xml).find('projectStatus').each(function(){

var projectStatusUid = $(this).find('projectStatusUid').text();
var projectId = $(this).find('projectId').text();
var projectName = $(this).find('projectName').text();
var documentName = $(this).find('documentName').text();
var scheduleStatusDescription = $(this).find('scheduleStatusDescription').text();
var riskStatusDescription = $(this).find('riskStatusDescription').text();
var scopeStatusDescription = $(this).find('scopeStatusDescription').text();
var budgetStatusDescription = $(this).find('budgetStatusDescription').text();
var addedBy = $(this).find('addedBy').text();
var added = $(this).find('added').text();
var clientName = $(this).find('clientName').text();

var uid = '';
var lnk = '' + projectName + '';

historyTable.fnAddData( [
uid + lnk,
scheduleStatusDescription,
riskStatusDescription,
scopeStatusDescription,
budgetStatusDescription,
added,
addedBy,
clientName] );
});

$("#status-report-history-link").fancybox({
'hideOnContentClick': false,
'padding' : 0,
'frameWidth' : 780,
'frameHeight' : 420,
'showCloseButton' : true,
'centerOnScroll' : true
});

$("#status-report-history-link").trigger("click");

};
};
[/code]