See:
http://docs.jquery.com/Frequently_Asked_Questions#Why_do_my_events_stop_working_after_an_AJAX_request.3F
In a nutshell, you're declaring a click handler for all elements with
class 'img_del' *when the page loads*. But your element is being added
during the onComplete callback of uploadify() so it has no click
handler assigned to it. To get around that, you would place the
$(".img_del").click(function () { etc. code in a function and call the
function both when the page first loads as well as after adding a new
element.
Or, you can deal with it the simpler way and use the new live() function:
http://docs.jquery.com/Events/live
Using this, you can assign an event handler to any elements on the
page *and* tell jQuery to do the same for any new elements added that
match the selector criteria.
eg.
$(".img_del").live('click', function() {
var image_name = this.id;
$.ajax({
type: "get",
url: "inc/ajax_del_pic.php?img="+image_name,
success: function(msg){
alert(msg);
}
});
});
On Thu, Nov 26, 2009 at 12:57 PM, heohni
<heidi.anselstet...@consultingteam.de> wrote:
> Hi,
>
> This function:
>
> var c_folder = $('input[name="client_folder"]').val();
> $("#uploadify").uploadify({
> 'uploader' : 'inc/fileupload/uploadify.swf',
> 'script' : 'inc/fileupload/uploadify.php',
> 'scriptData' : {'c_folder': c_folder},
> 'cancelImg' : 'inc/fileupload/cancel.png',
> 'folder' : 'images/uploads',
> 'queueID' : 'fileQueue',
> 'auto' : true,
> 'multi' : true,
> 'queueSizeLimit' : 3,
> 'buttonText' : 'Auswahl',
> 'sizeLimit' : 10000000,
> 'fileDesc' : '*.jpg;*.jpeg;*.png',
> 'fileExt' : '*.jpg;*.jpeg;*.png',
> 'onComplete': function(event, queueID, fileObj, reposnse,
> data) {
> $('#filesUploaded').append('<img src="inc/fileupload/
> cancel.png" alt="" id="'+c_folder+'/'+fileObj.name+'" class="img_del"
> border="0" style="padding-right:5px; cursor: pointer;"><a
> target="_blank" href="images/uploads/'+c_folder+'/'+fileObj.name
> +'">'+fileObj.name+'</a><br><br>');
> $('#fileQueue').css({'display' : 'none'});
> $('#cancel').css({'display' : 'none'});
> }
> });
>
> $(".img_del").click(function () {
> var image_name = this.id;
> $.ajax({
> type: "get",
> url: "inc/ajax_del_pic.php?img="+image_name,
> success: function(msg){
> alert(msg);
> }
> });
> });
>
> The Script is uploading the pics great and shows me the delete image.
> But on click, the function to delete the picture is not getting called
> and I don't get why?
> Any ideas why it seams that the element img_del seem not available?
>
