Web server controls in ASP.Net - part 3

This is the third post in a series of posts regarding web server controls.

You can find the first post here and the second post here.  In this post, I am going to look into the FileUpload web server control.

Basically with this control you try to give the user the same functionailty with a ftp client.

I will try show how to upload one file and how to upload multiple files using the FileUpload control. .

I will be using VS 2010 Ultimate edition and C# to create a simple asp.net application.


1) Launch Visual Studio 2010/2005/2008. Express editions will be fine.

2) Create a new asp.net web site and call it “uploadcontrol”.

3) Drag and drop in the default.aspx page a FileUpload control from the Toolbox

4) If you run your application now , you will see a page that does not do much, just a textbox and “Browse” button that are part of the FileUpload control

5) Stop your application and place a button in the default.aspx page

6) Add a Label control in your application. Leave the default names for all the controls on the page.

7) Create a folder in the C drive and call it “myUploads”

8) Double click on the button and in the event handling routine and type

if (FileUpload1.HasFile) {
FileUpload1.SaveAs(“C:\\myUploads\\” + FileUpload1.FileName);
Label1.Text = “File name: ” +
FileUpload1.PostedFile.FileName + “<br>” +
FileUpload1.PostedFile.ContentLength + ” kb<br>” +
“Content type: ” +
FileUpload1.PostedFile.ContentType;
}
else
{
Label1.Text = “You have not selected a file or the file has not been found.”;
}


First of all let’s explain the lines above.

Initially we use the HasFile Property which returns a value indicating whether the FileUploadcontrol contains a file.

9) Run your application again and try to upload a file

If that is true we append in the text property of the Label control , the following information

  •    filename
  •    file size
  •    type of the document, e.g image,word document, e.t.c


We achieve that by using the PostedFile property , which holds the file that is being uploaded.

Before going to show more things regarding the FileUpload control, I will add a Try Catch statement in the code above to provide some sort of exception handling.


if (FileUpload1.HasFile)
try
{
FileUpload1.SaveAs(“C:\\myUploads\\” + FileUpload1.FileName);
Label1.Text = “File name: ” +
FileUpload1.PostedFile.FileName + “<br>” +
FileUpload1.PostedFile.ContentLength + ” kb<br>” +
“Content type: ” +
FileUpload1.PostedFile.ContentType;
}
catch (Exception ex)
{
Label1.Text = “ERROR: ” + ex.Message.ToString();
}
else
{
Label1.Text = “You have not specified a file or the file has not been found.”;
}


Now let’s see how you can upload mutliple files from a single page.

1) Create a new .aspx page and add it to your project, by adding a new item from the Solutions window.

2) Place 3 FileUpload controls on the page. Also add a button and a label control.

3) In the event handling routine for the click event of the button, type

thefileupload(FileUpload1);
thefileupload(FileUpload2);
thefileupload(FileUpload3);


In order to upload the three files at once, I make 3 seperate calls to the method, thefileupload.

So I have created a method of my own which I call thefileupload. This is the code for the method


private void thefileupload(FileUpload upload)
{
if (upload.HasFile)
try
{
upload.SaveAs(“C:\\myUploads\\” + upload.FileName);
}
catch (Exception ex)
{
Label1.Text = “ERROR: ” + ex.Message.ToString();
}
else
{
Label1.Text = “You have not specified a file or the file has not been found.”;
}
}

Now, some very important notes for you to keep in mind. If you want the file upload functionality to work make sure that the destination folder on the server is  writable for the account used by ASP.NET.

If ASP.NET is not enabled to write to the folder you want, you can enable it using the folder’s properties.

If you want to permit your users to upload large files you should overwrite in the web.config file, the default size limitation which is 4MB (4096kb)

<httpRuntime
    maxRequestLength="1048576"
  
  />

If you want the source code you can email me.

Hope it helps!!!


2 Comments

Comments have been disabled for this content.