This tutorial will show how we use the FileUpload Control to upload a file to the website, whilst simultaneously creating a thumbnail of the image, and saving that too. C# version.

In this tutorial, we will create a single file upload form and a GridView to display the list of uploaded files.
The upload form will upload a single file at a time, when the user click the button, and it will also create a thumbnail of the image, saving both images to the uploads folder.

First, we add the controls to the ASPX page (FileUpload, Button, and GridView):

The GetUploadList() function will retrieve a list of filenames in the uploads directory, and then insert them into an array. The function returns an array of all the filenames in the upload folder.
The buttonUpload_click event first checks to see if the file exists; if it does not, then it saves it to the uploads directory. Then the image is analyzed (height & width), and then resized to 128px. Finally, the thumbnail is created and saved to the uploads directory with “_th” added to the end of the filename, and the GridView is updated.
The UploadedFiles_RowDeleting function allows the user to delete any file in the GridView by simply clicking the icon.
The code-behind will look something like this:

Download Source Files