Datatable inside Fancybox

Datatable inside Fancybox

smsorensensmsorensen Posts: 8Questions: 0Answers: 0
edited September 2010 in General
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).

Replies

  • smsorensensmsorensen Posts: 8Questions: 0Answers: 0
    [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]
This discussion has been closed.