[Issue] Datatable + Fancybox

Jr0x

Hi,

I have a small issue with Fancybox while using Datatable. Most of the thing are working fine, it's just the scrolling of images doesn't work quite right.

I've addon Fancybox to Datatable with the following changes.

Server processing:
[code]$sOutput .= '"View",';[/code]

jQuery:
[code]"fnDrawCallback": function() {
$("#modal a").fancybox();
}, [/code]

Finally, popup:

[code]
$(document).ready(function() {
$("a[rel=example_group]").fancybox({
'transitionIn' : 'none',
'transitionOut' : 'none',
'titlePosition' : 'over',
'titleFormat' : function(title, currentArray, currentIndex, currentOpts) {
return 'Image ' + (currentIndex + 1) + ' / ' + currentArray.length + (title.length ? '   ' + title : '') + '';
}
});
});


a {outline: none;}
a img {
border: 1px solid #BBB;
padding: 2px;
margin: 10px 20px 10px 0;
vertical-align: top;
}



<?php echo $_GET['id']; ?>


Image gallery (ps, try using mouse scroll wheel)






[/code]

You can have a look at the example over http://belief.sg/trial/index.php?display=property&type=hdb
Click on the View button, a boxup with images will be shown. Click on one of the image, and try to move to the next one or back. The image will not be changed.

Any idea why is this happening?

Jr0x

Any help?

UPEngineer

Well I am no expert, but it appears your return is returning the above popup code each and every time you click on the view link.

You're returning your source code instead of the image.

The fancybox code should be on your datatables page and not returned from your php reponse.

For example, Line 24 is echoing your id variable instead of using that variable and finding the picture with that id. Does that make sense?

Look at your php code and especially the response back to datatables and I bet you find your problem.

Hope it helps.

Jr0x

Hi UPEngineer,

Thanks for the response.

Yes, each view will return the popup and base on the ID that was passed, search for the photos.

The above is just only a example with 3 photos that I linked directly. I'm doing the exact same thing without datatable and it is working fine.