how to invoke html control event without html control

Question

Is it possible to invoke fileupload event at button click?

I need something like this

  <input type="button" onclick="return buttonClicked()">

And invoking fileupload event should come inside buttonClicked() event

 function buttonClicked()
     {
       preventDefault();
       ...File upload event
     }

I have been searching for this functionality for some time and it seems quite a simple functionality but couldn't find any solution for this.

really need help on this one

Answer 1

You may use following jQuery Plugin:

jQuery site link: https://plugins.jquery.com/uploadfile/

Github link: https://github.com/hayageek/jquery-upload-file

The pluging exposes following events as callback:

$("#aDivforUpload").uploadFile({
    url: "http://hayageek.com/examples/jquery/ajax-multiple-file-upload/upload.php",
    multiple: true,
    fileName: "myfile",
    onSubmit: function(files) {
        $("#eventsmessage").html($("#eventsmessage").html() + "<br/>Submitting:" + JSON.stringify(files));
    },
    onSuccess: function(files, data, xhr) {
        $("#eventsmessage").html($("#eventsmessage").html() + "<br/>Success for: " + JSON.stringify(data));
    },
    afterUploadAll: function() {
        $("#eventsmessage").html($("#eventsmessage").html() + "<br/>All files are uploaded");

    },
    onError: function(files, status, errMsg) {
        $("#eventsmessage").html($("#eventsmessage").html() + "<br/>Error for: " + JSON.stringify(files));
    }
});

Here is the demo with nice documentation for this plugin:

http://hayageek.com/docs/jquery-upload-file.php

UPDATE : Here is the jsFiddle i've created:http://jsfiddle.net/raishul/2x32tq3p/

Answer 2

If you are Working with asp.net you can use generic handler and call it through ajax to upload your files.

if you are interested in this let me know to give you a complete answer.

In asp.net You can use this Tutorial one it's pretty much what I do. This will allow you to upload the file without post back. There is another way that uploads in the server side using asp.net control FileUpload, but I don't recommend it.