I’m working on the CMS for a website. In the CMS I have a page where you can handle the photos in a gallery (add photos and delete photos). What I try to accomplish is to manage the descriptions (3 languages) for each photo. What I have in mind is the following.
When you click on one of the photos a dialog will open with 3 input fields with the 3 descriptions belonging to the photo that was clicked.
This is the function that I thought would do the trick:
<script type="text/javascript">
$(function() {
$("#descriptions").dialog({
autoOpen: false
});
$("#gallery a").on("click", function(e){
e.preventDefault();
var id = $(this).data("photo");
$("#descriptions").dialog("open");
$.ajax({
data: {photo_id: id}
});
});
});
</script>
And in the dialog box I have a form with the three text fields holding the descriptions and the following query:
SELECT photo_id, description FROM portfolio WHERE photo_id = :photo_id
And the photos in the gallery looks like this:
<li><a href="javascript:void(0)" data-photo="#getGallery.photo_id#"><img src="portfolio/thumbnails/#getGallery.photo#"></a></li>
But that isn’t working! What is wrong in this approach?
Thank you in advance.