Disable upload button after uploading image http://valums.com/ajax-upload/

Question

I am using this, valums ajax fileupload: http://valums.com/ajax-upload/ , It is working fine for me. I want to disable the upload button as I upload an image and want add 2 more buttons beside it "Delete" and "View". How would I do this using existing JS file.

something similar here: http://stackoverflow.com/questions/5122602/how-to-disable-ajax-upload-button — Sudhir Bastakoti, Jan 19 '12 at 07:31
Hey Sudhir, definitely I'll post like this next time. Thanks a lot guiding me. — Lalit W, Jan 19 '12 at 09:06

score 0 · Answer 1 · answered Jan 19 '12 at 08:01

without any code all we can do is guess, but assuming there are 2 elements, a button with id='upload-button' that is a child of an element with id='upload-button-container' you could do something like the following:

$("#upload-button").hide();
$("#upload-button-container").append($("<button type='button'>Delete</button><button type='button'>View</button>"));

dku.rajkumar · Accepted Answer · 2012-01-19T08:10:04.927

you can do it as below

$.ajax({
....
....
....
success:function(resposne){
  // do something 
  $('#upload').attr("disabled", true);
  $('#upload').parent().append('<input type="button" value="delete" id="delete"/>
                                 <input type="view" value="click" id="view"/>');
    }    
});

then for handling delete and view button click, since these are dynamically added element you have to delegate event handler using on. The normal click handler will not work on dynamically added elements.

$('body').on("click","#delete",function(){
// do the delete operation
});

$('body').on("click","#view",function(){
// do the view operation
});

score 0 · Answer 3 · answered Jan 19 '12 at 08:07

So, if your upload button has the id "upload_button" and the two buttons you want to add are already there, but hidden. (and with the class "hidden_btn")

with jquery, you can do this:

$("#upload_button").attr("disabled","disabled")
$(".hidden_btn").show()

Disable upload button after uploading image http://valums.com/ajax-upload/

3 Answers3