Hi all,
I have a modal form that changes the caption of a photo (paragraph under the image) and I am also trying to change the image's ALT attribute but cannot seem to.
Here is the jQuery I am trying to make work
$(".edit").click(function() {
var parent = $(this).parents('.item');
var caption = $(parent).find('.labelCaption').html();
$("#photoCaption").val(caption);
$("#editCaptionDialog").dialog({
width: 450,
bgiframe: true,
resizable: false,
modal: true,
title: 'Edit Caption',
overlay: {
backgroundColor: '#000',
opacity: 0.5
},
buttons: {
'Edit': function() {
var newCaption = $("#photoCaption").val();
$(parent).find(".labelCaption").html(newCaption);
$(parent).find('img').attr('alt', newCaption);
}
}
});
return false;
});
And the HTML
<li class="item ui-corner-all" id="photo<? echo $images['id'];?>">
<div>
<a href="http://tapp-essexvfd.org/gallery/photos/<?php echo $images['filename'];?>.jpg" class="lightbox" title="<?php echo $images['caption'];?>">
<img src="http://tapp-essexvfd.org/gallery/photos/thumbs/<?php echo $images['filename'];?>.jpg" alt="<?php echo $images['caption'];?>" class="photo ui-corner-all"/></a><br/>
<p><span class="labelCaption"><?php echo $images['caption'];?> </span></p>
<p><a href="edit_photo.php?filename=<?php echo $images['filename'];?>" class="button2 edit ui-state-default ui-corner-all">Edit</a></p>
</div>
</li>
The caption is changing like it should.
Thanks