problem in file upload

I have the following markup:

  <select multiple="multiple" id="targetFilesList"  style="width:200px;height:110px;">
   </select>
   <input type="button" value="Get" id="btnGet" />

and following javascript:

    $(function()
    {
        $('#btnGet').click(function()
        {
            var fileupload = $("<input type='file' name='filetoupload' style='visibility:hidden;'/>");
            $('body').append(fileupload);

            fileupload[0].onchange = function()
            {
                $('#targetFilesList').append('<option >' + fileupload.val() + '</option>');
                return false;
            }
            fileupload.click();
        });
    });

Scenario is that i have to upload multiple files and once user has chosen the file to be uploaded i have to show the file name to user.Then,on submitting the form i will upload all the files.For this,on clicking the get button i am adding a fileupload control dynamically and initialise onchange event of the fileupload control just added. The problem in chrome 12 on clicking get button fileupload control does not get opened but in firefox4 and ie8 it is working. Any idea why?

Cakephp file upload problem

I am using Cakephp as my framework. I have a problem in uploading my files through a form. I am using an Uploader plugin from THIS website. My php ini file has this piece of code. upload_max_filesi

php file upload problem

This code works properly in my localhost. I am using xampp 1.7.3. but when I put it in the live server it shows Possible file upload attack!. ‘upload/’ is the folder under ‘public_html’ folder on the

file upload control problem

i am using file upload control in server side when iam trying to get the file it is showing no file present <asp:FileUpload ID=upldDocument runat=server /> string fileExtension = System.IO.P

Problem in file upload

whenever i am uploading trying to upload file having size more than the size specified in maxRequestLength , browser is showing webpage can not be displayed . an someone please tell me how to solve

File Upload Problem

I am trying to upload multiple files but when i select more than 1 djz_file it doesn’t get any information form $_POST and $_FILES, in case of single file it works well. <fieldset> <legend&g

File upload problem in iphone

I want to upload a plist file to my server from my iphone app. I have tried the following code (found googling), but my file is still not uploaded. Where is the problem? iphone app code (method which

SCP upload file problem

I need to upload file with SCP. I found on stackoverflow this library http://code.google.com/p/commons-net-ssh/ I download .jar and add to BuildPath, but how to add username and password to this ? I t

Struts File Upload Problem

i have problem in file uploading in struts my jsp file code Name Of Candidate Candidate Current Designation Candidate Total Experiance Current Salary Excpected Salary Ready To Relocate Educat

PHP file upload problem

I’ve got a really annoying problem with file uploads. Users can choose a file in an html file field. When they submit the form, this file will be uploaded. On the serverside I just use standard PHP co

Heroku file upload problem

I’ve been having a problem uploading a CSV file to Heroku and processing it. It works fine in my local environment. Just do be clear, I don’t need to save the file on Heroku, just access it during the

Answers

To get it working on Chrome 12, you can just add it into a window timeout of 0, like this:

window.setTimeout(function(){
   fileupload.click();   
},0);

Why exactly it behaves like this, I am not sure. The first time I encountered the problem I tried it with a longer interval, reducing it all the time to see how low you could get it, until I noticed it doesn’t even need a delay. The obvious answer would be that it isn’t actually ready in DOM by the time you trigger the click (element is there, but is the appropriate events for it?).

example: http://jsfiddle.net/HgEga/

Doing this kind of code yourself can be a pain. Maybe taking a look to an existing multiple file upload jQuery plugin will help.