Question

我的照片表是

Column Name Data Type   Constraint
PhotoID     Int         Primary key,auto increment
PhotoName   Varchar(100)    
ExtName     Varchar(100)    
PhotoType   Varchar(100)    
PhotoSize   Int 
TempleID    Int         Foreign key with templeinfo

和插入程序是

create proc [dbo].[prcTemplePhoto]
(
@PhotoName  Varchar(100),
@ExtName    Varchar(100),
@PhotoType  Varchar(100),
@PhotoSize  int,
@TempleID   Int
)
as
insert into TemplePhoto(PhotoName,ExtName,PhotoType,PhotoSize,TempleID) values (@PhotoName,@ExtName,@PhotoType,@PhotoSize,@TempleID)
select @@IDENTITY

我想一次上传多张照片，因为我从互联网上复制了代码

on designside

<tr>
        <td>
            <asp:Label ID="lbltemplepic" runat="server" Text="Temple Photo"></asp:Label>
        </td>
        <td id="fileUploadarea">
            <div>
                <div id="Div1">
                    <asp:FileUpload ID="templeupload" 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="btnuplaod" runat="server"  Text="Upload" OnClick="btnuplaod_Click"  />
                </div>
            </div>
        </td>
        <td></td>
    </tr>
<tr><td></td><td>
    <asp:Button ID="btninsert" runat="server" Text="Insert" OnClick="btninsert_Click"  />
    </td><td></td></tr>
    <tr><td></td><td>
        <asp:Label ID="lblerror" runat="server" Text=""></asp:Label></td><td></td></tr>
                   <script lang="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>

和代码方

 if (templeupload.HasFile)
                {
                    TemplePhoto tempphoto = new TemplePhoto();
                    tempphoto.PhotoName = templeupload.FileName;
                    tempphoto.PhotoSize = templeupload.PostedFile.ContentLength;
                    tempphoto.PhotoType = templeupload.PostedFile.ContentType;
                    tempphoto.ExtName = tempphoto.PhotoName.Substring(tempphoto.PhotoName.LastIndexOf(".") + 1);
                    tempphoto.TempleID = ans;
                      HttpFileCollection hfc = Request.Files;
                      for (int i = 0; i < hfc.Count; i++)

                      {
                                HttpPostedFile hpf = hfc[i];
                                if (hpf.ContentLength > 0)
                                {
                    int id = new DBTemplePhoto().InsertData(tempphoto);
                    if (id != 0)
                    {
                                    hpf.SaveAs(Server.MapPath("~/templepics/") + ans.ToString() + "." + tempphoto.ExtName);
                                    lblerror.Text = " File is Uploaded ";
                                }
                                     else
                    {
                        lblerror.Text = "Please check all the fields";
                    }
                            }
                      }

但它只上传了一张图片

实际上我想要像gmail一样多个图片上传器，但我已经妥协了这个。你可以帮我解决代码上的错误，上传多个图片。如果可能的话，请告诉代码获取像gmail这样的上传者

Answer 1

尝试在服务器端向表单添加multipart / form-data：

this.Form.Enctype = "multipart/form-data";

不要重复使用“templeupload”属性，只使用循环中的“HttpPostedFile hpf”属性。

要获得更好的多文件上传器，请检查JqueryFileUpload插件： https://github.com/i-e-b/jQueryFileUpload.Net

Answer 2

在文件上传控件上设置允许多文件上传属性：

<asp:FileUpload ID="templeupload" runat="server" CssClass="fileUpload" 
    AllowMultiple="true" />

在服务器上，您必须遍历PostedFiles集合。

foreach(HttpPostedFile hpf in templeupload.PostedFiles)
{
    //do stuff with hpf
    hpf.SaveAs(...);
}

多个图片上传代码不起作用？

2 个答案: