I am using ajaxFileUpload
along with codeigniter for uploading image.If I browse the image,image uploaded. After upload the image I am showing the image along with an cancel button (#cancel)
after the image. I wrote code for cancel button,it deletes the image from server.It is working properly. But after canceling the image the whole process is not working as first time.
The code is like below
$(function() {
$('#item_photo_uload').change(function(e)
{
e.preventDefault();
$.ajaxFileUpload({
url :site_url+'/menu/upload_file',
secureuri :false,
fileElementId :'item_photo_uload',
dataType :'json',
success : function (data,status)
{
if(data.status != 'error')
{
$('#one_file').html('<img src="'+base_url+'assets/images/item_photo/'+data.file_name+'" height="50" width="100"/><img id="cancel" title="Cancel This Image" src="'+base_url+'assets/images/item_photo/cancel.png"/>' );
$('#cancel').click(function()
{
if (confirm('Are you sure you want to delete this file?'))
{
$.post(site_url+'/menu/delete_file',{file_name: data.file_name},function(data)
{
if(data)
{
$('#one_file').html('');
$("#item_photo_uload").prop('disabled', false);
$("#item_photo_uload").val("");
}
});
}
});
}
}
});
$("#item_photo_uload").val("");
$("#item_photo_uload").prop('disabled', true);
return false;
});
});
Here #one_file
is a div to show the image, #item_photo_uload
is the input field for browsing the file.