web-dev-qa-db-ja.com

ファイルアップロードコントロールを使用して複数のファイルを選択する方法

ファイルアップロードコントロールがあります。今すぐクリックして、複数のファイルを選択します。

どうすればできますか?

31
priyanka.sarkar

FileUpload.AllowMultiple。NET 4.5以降のプロパティを使用すると、コントロールで複数のファイルを選択できます。

<asp:FileUpload ID="fileImages" AllowMultiple="true" runat="server" />

.NET 4以下

 <asp:FileUpload ID="fileImages" Multiple="Multiple" runat="server" />

ポストバックでは、次のことができます。

 Dim flImages As HttpFileCollection = Request.Files                   
 For Each key As String In flImages.Keys
    Dim flfile As HttpPostedFile = flImages(key)
    flfile.SaveAs(yourpath & flfile.FileName)
 Next
47

これは、ファイルアップロードコントロールを使用してasp.netで複数のファイルを選択してアップロードする方法の完全な例です。

このコードを.aspxファイルに記述します。

<head runat="server">
    <title></title>
</head>
<body>
<form id="form1" runat="server" enctype="multipart/form-data">
<div>
    <input type="file" id="myfile" multiple="multiple" name="myfile" runat="server" size="100" />
    <br />
    <asp:Button ID="Button1" runat="server" Text="Button" OnClick="Button1_Click" />
    <br />
    <asp:Label ID="Span1" runat="server"></asp:Label>
</div>
</form>
</body>
</html>

その後、このコードを.aspx.csファイルに記述します。

   protected void Button1_Click(object sender,EventArgs e) {
          string filepath = Server.MapPath("\\Upload");
          HttpFileCollection uploadedFiles = Request.Files;
          Span1.Text = string.Empty;

          for(int i = 0;i < uploadedFiles.Count;i++) {
              HttpPostedFile userPostedFile = uploadedFiles[i];

              try {
                  if (userPostedFile.ContentLength > 0) {
                     Span1.Text += "<u>File #" + (i + 1) +  "</u><br>";
                     Span1.Text += "File Content Type: " +  userPostedFile.ContentType      + "<br>";
                     Span1.Text += "File Size: " + userPostedFile.ContentLength           + "kb<br>";
                     Span1.Text += "File Name: " + userPostedFile.FileName + "<br>";

                     userPostedFile.SaveAs(filepath + "\\" +    Path.GetFileName(userPostedFile.FileName));                  
                     Span1.Text += "Location where saved: " +   filepath + "\\" +   Path.GetFileName(userPostedFile.FileName) + "<p>";
                  }
              } catch(Exception Ex) {
                  Span1.Text += "Error: <br>" + Ex.Message;
              }
           }
        }
    }

これで、複数ファイルのアップロードコントロールの準備が整いました。幸せな一日を。

28
Deepak
        aspx code

            <asp:FileUpload ID="FileUpload1" runat="server" AllowMultiple="true" />
            <asp:Button ID="btnUpload" Text="Upload" runat="server" OnClick ="UploadMultipleFiles" accept ="image/gif, image/jpeg" />
            <hr />
            <asp:Label ID="lblSuccess" runat="server" ForeColor ="Green" />


    Code Behind:

protected void UploadMultipleFiles(object sender, EventArgs e)
{
     foreach (HttpPostedFile postedFile in FileUpload1.PostedFiles)
     {
          string fileName = Path.GetFileName(postedFile.FileName);
          postedFile.SaveAs(Server.MapPath("~/Uploads/") + fileName);
     }
     lblSuccess.Text = string.Format("{0} files have been uploaded successfully.", FileUpload1.PostedFiles.Count);
}
5
Jaydeep Shil

ステップ1:追加

<asp:FileUpload runat="server" id="fileUpload1" Multiple="Multiple">
    </asp:FileUpload>

ステップ2:追加

Protected Sub uploadBtn_Click(sender As Object, e As System.EventArgs) Handles uploadBtn.Click
    Dim ImageFiles As HttpFileCollection = Request.Files
    For i As Integer = 0 To ImageFiles.Count - 1
        Dim file As HttpPostedFile = ImageFiles(i)
        file.SaveAs(Server.MapPath("Uploads/") & ImageFiles(i).FileName)
    Next

End Sub
4
Marsowl

default.aspxコード

<asp:FileUpload runat="server" id="fileUpload1" Multiple="Multiple">
        </asp:FileUpload>
<asp:Button runat="server" Text="Upload Files" id="uploadBtn"/>

default.aspx.vb

Protected Sub uploadBtn_Click(sender As Object, e As System.EventArgs) Handles uploadBtn.Click
    Dim ImageFiles As HttpFileCollection = Request.Files
    For i As Integer = 0 To ImageFiles.Count - 1
    Dim file As HttpPostedFile = ImageFiles(i)
        file.SaveAs(Server.MapPath("Uploads/") & file.FileName) 
    Next       
End Sub
2
user3342540

これらのコントロールを使用できる他のオプションがあり、複数のアップロードオプションがあり、これらのコントロールにはAjaxもサポートされています

1) Flajxian
2) Valums
3) Subgurim FileUpload

2
skhurams

.NET 4.5以降のFileUpload.AllowMultipleプロパティを使用すると、コントロールで複数のファイルを選択できます。

4.0のような4.5以下(vs 2010)では、2つのjsファイルを使用して、単一コントロールで複数のファイルをアップロードするためにjqueryを使用できます。 http://code.jquery.com/jquery-1.8.2.js および http://code.google.com/p/jquery-multifile-plugin/

aspxファイルのアップロードタグに、class = "multi"のように追加します

<asp:FileUpload ID="FileUpload1" class="multi" runat="server" />

作業例が必要な場合は、 link サンプルをダウンロードしてください。

複数のファイルを追加するには、以下のコードを使用します

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title></title>
    <style type="text/css">
    .fileUpload{
    width:255px;    
    font-size:11px;
    color:#000000;
    border:solid;
    border-width:1px;
    border-color:#7f9db9;    
    height:17px;
    }
    </style>
</head>
<body>
    <form id="form1" runat="server">
    <div>
    <div id="fileUploadarea"><asp:FileUpload ID="fuPuzzleImage" runat="server" CssClass="fileUpload" /><br /></div><br />
    <div><input style="display:block;" id="btnAddMoreFiles" type="button" value="Add more images" onclick="AddMoreImages();" /><br />
        <asp:Button ID="Button1" runat="server" onclick="Button1_Click" Text="Upload" />
        </div>
    </div>
    <script language="javascript" type="text/javascript">
        function AddMoreImages() {
            if (!document.getElementById && !document.createElement)
                return false;
            var fileUploadarea = document.getElementById("fileUploadarea");
            if (!fileUploadarea)
                return false;
            var newLine = document.createElement("br");
            fileUploadarea.appendChild(newLine);
            var newFile = document.createElement("input");
            newFile.type = "file";
            newFile.setAttribute("class", "fileUpload");

            if (!AddMoreImages.lastAssignedId)
                AddMoreImages.lastAssignedId = 100;
            newFile.setAttribute("id", "FileUpload" + AddMoreImages.lastAssignedId);
            newFile.setAttribute("name", "FileUpload" + AddMoreImages.lastAssignedId);
            var div = document.createElement("div");
            div.appendChild(newFile);
            div.setAttribute("id", "div" + AddMoreImages.lastAssignedId);
            fileUploadarea.appendChild(div);
            AddMoreImages.lastAssignedId++;
        }

    </script>
    </form>
</body>
</html>

サーバー側のコード:

try
{
    HttpFileCollection hfc = Request.Files;
    for (int i = 0; i < hfc.Count; i++)
    {
        HttpPostedFile hpf = hfc[i];
        if (hpf.ContentLength > 0)
        {                        
            hpf.SaveAs(Server.MapPath("~/uploads/") +System.IO.Path.GetFileName(hpf.FileName);                        
        }
    }
}
catch (Exception)
{
    throw;
}
1
Sumit Jambhale

以下のコードを試すことができます:

 Protected Sub Button1_Click(ByVal sender As Object, ByVal e As System.EventArgs) Handles Button1.Click
    Try
        Dim j As Integer = 0
        Dim hfc As HttpFileCollection = Request.Files
        Dim PathName As String
        For i As Integer = 0 To hfc.Count - 1
            Dim hpf As HttpPostedFile = hfc(i)

            If hpf.ContentLength > 0 Then
                hpf.SaveAs(Server.MapPath("~/E:\") & System.IO.Path.GetFileName(hpf.FileName))
                PathName = Server.MapPath(hpf.FileName)

                If j < hfc.Count Then
                    Dim strConnString As String = ConfigurationManager.ConnectionStrings("conString").ConnectionString
                    Dim sqlquery As String
                    sqlquery = "Insert_proc"
                    Dim con As New SqlConnection(strConnString)
                    Dim cmd As New SqlCommand(sqlquery, con)

                    cmd.CommandType = CommandType.StoredProcedure

                    cmd.Parameters.Add("@FilePath", SqlDbType.VarChar).Value = PathName
                    j = j + 1

                    Try
                        con.Open()
                        cmd.ExecuteNonQuery()


                    Catch ex As Exception
                        Throw ex
                    Finally
                        con.Close()
                        con.Dispose()

                    End Try
                    If j = hfc.Count Then
                        Exit Sub
                    End If
                End If
            End If
        Next

    Catch generatedExceptionName As Exception

        Throw
    End Try
End Sub
0
sona

.Net 4.5(以前のバージョンでは簡単にサポートされていません)を使用していて、jQueryを使用して非常にシンプルで痛みのないものにすることができる場合、この見事にシンプルなソリューションに出くわします。

ASP.Net 4.5でjQueryと汎用ハンドラーを使用して複数のファイルをアップロードする

もちろん、クラシック版の商用版がありますASPこれは ASPアップローダー

0
Tom