Upload button will not fire programmatically

Question

I have a button with which i want to use the "upclick"-plugin for uploading files

<script type="text/javascript" src="~/Scripts/upclick-min.js"></script>

<input type="button" id="uploader" value="Upload" >

<script type="text/javascript">

   var uploader = document.getElementById('uploader');

   upclick(
     {
      element: uploader,
      action: '/path_to/you_server_script.php', 
      onstart:
        function(filename)
        {
          alert('Start upload: '+filename);
        },
      oncomplete:
        function(response_data) 
        {
          alert(response_data);
        }
     });

Now the button works in itself and opens the "open file"-dialogue, but i cannot seem to fire the "click"-event on it programmatically. Ive tried all different ways of writing it syntax-wise:

if (ui.draggable.hasClass('ui-dragdrop-picElement')) {
                        //$("uploader").trigger("click");
                        //$("uploader").click();
                        //$('uploader').click();
                        //$('#uploader').click();
                        //$("#uploader").click(); 
                        //$("#uploader").trigger("click");  
                        //$('button#uploader').trigger('click');
                        $('#uploader').trigger('click'); 
                        alert("w00t");

                    }

and so on - any idea why it wont fire - i get the alert message!

score 1 · Answer 1 · answered Apr 18 '13 at 09:25

1

$("uploader")...

This isn't valid. There is no <uploader> element.

Your last .click uses the correct selector, but you'll want to use this with the .trigger() event:

$("#uploader").trigger("click");

You'll probably benefit a lot from going through the official jQuery tutorial: http://try.jquery.com.

answered Apr 18 '13 at 09:25

James Donnelly

126,410
34
208
218

This works fine. See this JSFiddle I've just whipped up: http://jsfiddle.net/M7NsQ/. If you click on "bb" the "aa" button click event will be fired. You should check your browser's JavaScript console to see if any JavaScript errors are being given, preventing your code from executing as desired. – James Donnelly Apr 18 '13 at 09:35
neither this $('#uploader').trigger('click'); or this $('button#uploader').trigger('click'); triggers my button :( - i get no output in console – SimontheS Apr 18 '13 at 09:46
This probably means that your `if (ui.draggable.hasClass('ui-dragdrop-picElement')) { ... }` isn't being entered. Add an `alert()` (or ideally a `console.log()`) message to the start of that if statement and run your code again. If the message isn't displayed then that if statement's conditions aren't being met. – James Donnelly Apr 18 '13 at 09:48
@user2214861 remove all those `$("uploader").trigger("click");` and `$("uploader").click();` lines from your if statement. You'll only need one `$('#uploader').trigger('click');` in there, followed by the `alert`, and nothing more. `if (...) { $('#uploader').trigger('click'); alert('...'); }` – James Donnelly Apr 18 '13 at 09:53
i have the alert: alert("w00t"); at the end of the 'if' - and this is displayed as it should ! – SimontheS Apr 18 '13 at 09:53
Does your button actually have a `click` event handler? What are you expecting to happen when it gets clicked? – James Donnelly Apr 18 '13 at 09:58
you can see all the code i have for the button in the first code snippet in my question - when i click the button a "open file"-dialogue opens - and this is what i also want to happen in the 'if'-statement – SimontheS Apr 18 '13 at 10:13
Is your `upclick()` actually being entered? Can you not simply call `upclick()` directly instead of `$('#uploader').trigger('click');`? – James Donnelly Apr 18 '13 at 10:23
if i just run upclick in the 'if' get the following error: Uncaught TypeError: Cannot read property 'element' of undefined upclick-min.js:1 upclick upclick-min.js:1 $.droppable.drop $.Widget._trigger $.widget._drop (anonymous function) (anonymous function) jQuery.extend.each $.ui.ddmanager.drop $.widget._mouseStop (anonymous function) $.widget._mouseUp (anonymous function) $.widget._mouseUp (anonymous function) _mouseUpDelegate jQuery.event.dispatch elemData.handle – SimontheS Apr 18 '13 at 10:53
I'd suggest looking through the documentation of "upclick" to find out how to properly call it. – James Donnelly Apr 18 '13 at 10:56

Upload button will not fire programmatically

1 Answers1