4

I'm working in tiny project that deal with multiple file uploading.

at the begining user have one fileupload control and a small image called fileuploadadder .

each time user click on fileuploadadder , a clone of the first fileupload control added to the page with jquery . the ids of the fileupload controls are uniqe. such as file1 , file2, ...

now , i want when user clicks on a button at the end of the page asp.net uploads the selected files.

tnx

Muhammad Akhtar
  • 51,913
  • 37
  • 138
  • 191
nOp
  • 179
  • 1
  • 14

1 Answers1

4

Here's an example:

<%@ Page Language="C#" %>
<%@ Import Namespace="System.IO" %>
<script type="text/c#" runat="server">
    protected void BtnUpload_Click(object sender, EventArgs e)
    {
        if (Request.Files != null)
        {
            foreach (string file in Request.Files)
            {
                var uploadedFile = Request.Files[file];
                if (uploadedFile.ContentLength > 0)
                {
                    var appData = Server.MapPath("~/app_data");
                    var fileName = Path.GetFileName(uploadedFile.FileName);
                    uploadedFile.SaveAs(Path.Combine(appData, fileName));
                }
            }
        }
    }
</script>
<!DOCTYPE html>
<html>
<head>
    <title></title>
</head>
<body>
    <form id="Form1" runat="server" enctype="multipart/form-data">
        <a href="#" id="add">Add file</a>
        <div id="files"></div>
        <asp:LinkButton ID="BtnUpload" runat="server" Text="Upload" OnClick="BtnUpload_Click" />
    </form>
    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js"></script>
    <script type="text/javascript">
        $('#add').click(function () {
            $('#files').append($('<input/>', {
                type: 'file',
                name: 'file' + new Date().getTime()
            }));
            return false;
        });
    </script>
</body>
</html>
Darin Dimitrov
  • 1,023,142
  • 271
  • 3,287
  • 2,928
  • App_data folder should not be used to upload such files, because this is a special folder reserved for data such as database files. – Muhammad Akhtar Jul 24 '11 at 12:12
  • @Muhammad Akhtar, it's just an example. And there's nothing bad of using the `App_Data` folder for storing uploaded files as shown by Phil Haack: http://haacked.com/archive/2010/07/16/uploading-files-with-aspnetmvc.aspx. It is not reserved exclusively for database. – Darin Dimitrov Jul 24 '11 at 12:13
  • hmm, but I have a problem using this folder before 2 years ago when I was working. I have post the issue on StackOverflow. Please check this http://stackoverflow.com/questions/1519790/images-that-are-in-app-data-folder-not-shown-in-browser – Muhammad Akhtar Jul 24 '11 at 12:17
  • @Muhammad Akhtar, the problem you had is that you was trying to serve files from this folder directly to the client. This of course is not possible as files from this folder are not served by ASP.NET. What I usually do is to use a HTTP handler to serve uploaded files from this folder. This allows me to control which user access which file. – Darin Dimitrov Jul 24 '11 at 12:19
  • hmm right. thanks for clarification. Can you give me an reference link for just my personal understanding? – Muhammad Akhtar Jul 24 '11 at 12:21
  • @Muhammad Akhtar, reference link for what? – Darin Dimitrov Jul 24 '11 at 12:25