Steven Zack
Steven Zack

Reputation: 5104

jQuery: how to get file name from fileupload control?

What I want to implement is by clicking "attach a file", a file browser will be open to let user choose a file. I use jQuery to set onclick function of "attach a file", and set the opacity of a fileuload control to be 0. So it is like display:none. But I don't know how to get the file that user selected from fileupload control. Even don't know what event should be capture in the process. I want to save the file in a hidden div, so I can use it in backend code. Any method?

UPDATE: OK, I think it's better to describe my question more clearly. That is, how to get selected filename when you click open button in browser window? If in backend it is as easy as

string fileName=FileUpload1.PostedFile.FileName;

I want to get the fileName in client using jQuery. Since I will use same fileUpload control to select multiple files, I need to add the filename into a hidden div when the browser window closed. Any idea?

Upvotes: 3

Views: 13311

Answers (2)

Yes - that Jake.
Yes - that Jake.

Reputation: 17121

The file upload control renders as an INPUT of type file. If you retrieve its Value after change, it will hold the name of the file.

Upvotes: 1

JonH
JonH

Reputation: 33143

As I said in my comments if you have the ID you will have the value.

Place a file upload control on your form, then place an asp.net button or any button for that matter.

Then its a matter of:

$(document).ready(function () {  

            $("#btnUpload").click(function () {  

                var FileUpload = $("#MyFileUploadControl").val();  
   ... }
 } 

Upvotes: 0

Related Questions