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?
Source: Tips4all
Doing this kind of code yourself can be a pain. Maybe taking a look to an existing multiple file upload jQuery plugin will help.
ReplyDelete