fnRowCallback + jQuery popeye

fnRowCallback + jQuery popeye

edited October 2010 in General Posts: 29
Hi,

I'm trying to get the row (most right column) to show out the images if any. I'm using jQuery popeye to achieve it.
Have no issue implementing outside DataTables but it couldn't load with DataTables.

Here's the code for jQuery.

var oTable = $('#example').dataTable( { "sPaginationType": "full_numbers", "bProcessing": true, "bServerSide": true, "sAjaxSource": "server_processing.php?dt=<?php echo $type; ?>&id=<?php echo $R1['agentid']; ?>", "aoColumnDefs": [ { "bSortable": false, "aTargets": [ 0 ] } ], "bStateSave": true, "fnRowCallback": function() { var options2 = { caption: true, navigation: 'hover', direction: 'left' } $('#ppy2').popeye(options2); }, // Default sorting order (column [index], type) "aaSorting": [[1, 'asc']], "oLanguage": { "sSearch": "Search all columns:" } });
And this is what I put with $sOutput in server side processing script.

$sOutput .= '"<div id=\"ppy2\"><ul class=\"ppy-imglist\"><li><img src=\"member/images/'.$dId.'/property/award.jpg\"></a></li></ul><div class=\"ppy-outer\"><div class=\"ppy-stage\"><div class=\"ppy-counter\"><strong class=\"ppy-current\"></strong> / <strong class=\"ppy-total\"></strong></div></div><div class=\"ppy-nav\"><div class=\"nav-wrap\"><a class=\"ppy-next\" title=\"Next image\">Next image</a><a class=\"ppy-prev\" title=\"Previous image\">Previous image</a><a class=\"ppy-switch-enlarge\" title=\"Enlarge\">Enlarge</a><a class=\"ppy-switch-compact\" title=\"Close\">Close</a></div></div></div></div>",';
I have tested with jsonlint and it returns a valid JSON. When I try to load the table, it says, 'A node was not returned by fnRowCallback.'

I know this is likely to due to the jQuery, but not sure why.

Replies

  • Posts: 57
    Hi,

    The main issue here is that the fnRowCallback function takes several parameters and needs to return the (possibly modified) nRow. See the details of the function here: http://datatables.net/usage/callbacks#fnRowCallback .

    Ultimately, I think what you want to do here is process your popeye stuff in the fnDrawCallback function instead of fnRowCallback. This ensures that you are calling .popeye() after all the rows/html has been put into the table. fnRowCallback is called before the rows are appended to the DOM/table, so it won't do what you want.

    Hope this helps.
  • Posts: 29
    Hey cdaigle,

    Thanks for that, didn't notice the difference while working on it.

    /slap .. LOL.
This discussion has been closed.