How to use ASP.NET Code Behind to launch FileUpload

Question

Is it possible to include an asp:Button with OnClick=DoFileUpload_Click, and the method runs whatever to launch the FileUpload class?

Answer 1

Hi Coreysan,

Thanks for reaching out.

To address your question about using an ASP.NET asp:Button with OnClick=DoFileUpload_Click to initiate a file upload with the FileUpload class or a Telerik control, here’s a streamlined guide:

1. User-Initiated File Selection: Browser security requires users to manually select files, preventing server-side or client-side code from choosing files programmatically. Telerik’s control (likely RadUpload or RadAsyncUpload), which appears as a TextBox, uses JavaScript to trigger a hidden <input type="file"> element’s click() event to open the file dialog.
2. Button-Driven Upload: An asp:Button with an OnClick event (e.g., DoFileUpload_Click) can process the selected file server-side. In the event handler, check if the FileUpload (or Telerik’s control) has a file and perform actions like saving to the server or updating a database.
3. Telerik’s Enhanced UI: Telerik’s upload controls provide advanced features like drag-and-drop, progress bars, or asynchronous uploads (e.g., via RadAsyncUpload). These integrate with server-side code, allowing the OnClick event to handle file processing similarly to asp:FileUpload. Check Telerik’s documentation for specific events like OnFileUploaded for customization.
4. Modern Upload Benefits: For large files, Telerik’s RadAsyncUpload supports chunked uploads and cancellation, reducing server load and enhancing user experience. The upload logic still resides in the server-side OnClick event.
5. Clarifying “Launch”: If “launch the FileUpload class” means opening the file dialog, this is a client-side JavaScript action (e.g., triggering a file input’s click()). Server-side code only processes the file after selection.
6. Security Note: File selection must be user-initiated to prevent unauthorized access, a standard browser security feature.

In summary, use an asp:Button with an OnClick event to process files selected via an asp:FileUpload or Telerik’s control. Telerik’s UI leverages JavaScript for file selection, but the upload is managed server-side. For optimal results, configure Telerik’s control (e.g., RadAsyncUpload) for advanced features while keeping server-side logic secure and efficient.

Hope this helps! If you agree with my suggestion, feel free to interact with the system accordingly!

Answer 2

You are 100% correct.

So, while the server code can’t start an upload?

 

The client side can “automatically” start an upload. However, the restriction I noted of using code to select a file is NOT possible. In other words, the base requirement of the user having to select the file(s) in question still exists.

 

Of course, the simple HTML FileUpLoad control provides a rather poor experience. When the user hits submit, and if the file is large?

Then it “feels” like the browser is frozen while the “whole” file is sent up to the server.

As a result, it makes sense to adopt a “modern” file upload library.

 

Those libraries can:

Provide a drag + drop hot spot in the browser.

They provide a nice progress bar.

They up-load the file(s) in small chunks. This allows display of a progress bar, and also allows a cancel button. (And thus, even canceling of a file upload responds instant to the user hitting cancel.

And, since the file is up-loaded in small chunks?

Then memory used is small, and load on the server (memory wise) is small.

And since the file is being up-load in small chunks?

Then you have no real file limit in terms of the file size being up-loaded.

Hence, it makes sense (in place of rolling your own) to adopt a nice file upload library and utility.

There are a good many commercial ones, and also quite a few high quality free ones.

 

 I use the free AjaxFileUploader from the ajax toolkit. That toolkit is for web forms, and has all kinds of nice controls and utilities (such as masked inputs, filtering characters, dialog boxes and more).

 

So, the file AjaxFile uploader looks like this to select files (you can use the “select file” to launch the file picker dialog, or you can use drag + drop of files into that so called "hot spot".

 

This example shows using drag + drop of some files:

 

 After you use "select file", (or drag + drop the files), then you can hit the upload button.

(As noted, these uploaders can also “start” uploading automatic without having to hit “upload”.

 

Hence, hitting upload?

I save the files, add a row to a database of files uploaded. And then when the uploading is done, I simply display the table rows into a simple GridView.

The result is thus this:

 

So, while many attempt to roll their own up-load utility?

It can be quite a bit of work, hence the suggestion to adopt an existing uploader.

Hence, all developers should have in their bag of utilities a great file uploading utility. Does not matter which library you adopt, but adopting such libraries will vast enhance any file uploading for your customers.

In place of the above GridView display, one I suppose could use a tree-view, and display a windows like file explore and hierarchy of files if desired.

 

 

 

Answer 3

Hi @Coreysan,

It is common to complete file upload through button click event. You can find such code example in the official sample: FileUpload Class - examples.

the method runs whatever to launch the FileUpload class

Do you mean you want complete multiple file uploads on one single button click event? If this is the case, you just need to handle the files in FileUpload controls at the same time in click event. Like this:

protected void Upload_Click(object sender, EventArgs e)
{
    if (FileUpload1.HasFile)
    {
        // Get the name of the file to upload.
        String fileName1 = FileUpload1.FileName;
        // do something else
    }
    if (FileUpload2.HasFile)
    {
        // do some judgments
        String fileName2 = FileUpload2.FileName;
        // something else
    }
}

But if I misunderstood your requirement, please feel free let me know.

Best regards,

Xudong Peng

---

If the answer is the right solution, please click "Accept Answer" and kindly upvote. If you have extra questions about this answer, please click "Comment".

Note: Please follow the steps in our documentation to enable e-mail notifications if you want to receive the related email notification for this thread.

Answer 4

Yes, possible.