asp.net 2.0中允许一次上传多个文件的设计[转]

来源:互联网 发布:pe数据恢复 编辑:程序博客网 时间:2024/06/06 07:30

在asp.net 2.0中,可以结合dhtml来实现在用户上传完一个文件后,再点“继续上传”,而动态增加上传文件框
首先是前台的页面
<script language="javascript" type="text/javascript">
function addFile(max)

var file = document.getElementsByName("File"); 
if(file.length == 1 && file[0].disabled == true)
{
   file[0].disabled = false;
   return;
}
if(file.length < max)
{
   var filebutton = '<br /><input type="file" size="50" name="File" class="Button" />';
   document.getElementById('FileList').insertAdjacentHTML("beforeEnd",filebutton);
}
}
</script>
</head>
<body>
    <form id="form1" runat="server" method="post" enctype="multipart/form-data">
    <table class="Text" border="0" cellpadding="3" bgcolor="Black" cellspacing="1">
<tr bgcolor="white">
   <td>所属分类:</td>
   <td width="90%">
    <asp:DropDownList ID="ddlCategory" runat="server" SkinID="ddlSkin" Width="336px"></asp:DropDownList>
   </td>
</tr>
<tr bgcolor="white">
   <td valign="top">选择照片:</td>
   <td width="90%">
    <table border="0" cellpadding="0" cellspacing="0">
     <tr>   
      <td valign="top">
       <p id="FileList"><input type="file" disabled="disabled" size="50" name="File" class="Button" /></p>
      </td>
      <td valign="top"><input type="button" value='增加一张照片' class="Button" onclick="addFile(<%= MAXPHOTOCOUNT %>)" /><font color="red">(最多上传 <%=MAXPHOTOCOUNT%> 张照片)</font><br /> 单击此按钮增加一个上传照片按钮。如果文件的名称或者内容为空,则不上传该照片。</td>
     </tr> 
    </table>
   </td>
</tr>     
<tr bgcolor="white">
   <td>&nbsp;</td>
   <td width="90%">
    <asp:Button ID="btnCommit" runat="server" Text="提交" SkinID="btnSkin" Width="100px" OnClick="btnCommit_Click" />&nbsp;<asp:Label ID="lbMessage" runat="server" CssClass="Text" ForeColor="Red"></asp:Label>
   </td>   
</tr>
</table>
这里使用了一个javascript,来动态生成多个上传文件框,注意这里用了一个DHTML的函数insertAdjacentHTML,用法如下

加html内容(insertAdjacentHTML和insertAdjacentText)
    dhtml提供了两个方法来进行添加,insertAdjacentHTML和insertAdjacentText 
insertAdjacentHTML方法:在指定的地方插入html标签语句。
    原型:insertAdjacentHTML(swhere,stext) 
    参数: 
    swhere:指定插入html标签语句的地方,有四种值可以用: 
              1.beforeBegin:插入到标签开始前 
              2.afterBegin:插入到标签开始标记后 
              3.beforeEnd:插入到标签结束标记前 
              4.afterEnd:插入到标签结束标记后 
              stext:要插入的内容 
      例:var sHTML="<input type=button onclick=" +     "go2()" + " value='Click Me'><BR>" 
      var sScript='<SCRIPT DEFER>' 
      sScript = sScript +     'function go2(){ alert("Hello from inserted script.") }' 
      sScript = sScript + '</script' + '>'; 
      ScriptDiv.insertAdjacentHTML("afterBegin",sHTML + sScript); 
      在html正文中加入一行: 
    <DIV ID="ScriptDiv"></Div> 
     最终变成: 
    <DIV ID="ScriptDiv"> 
       <input type=button onclick=go2() value='Click Me'><BR> 
       <SCRIPT DEFER> 
         function go2(){alert("Hello from inserted sctipt.")}' 
       </script> 
     </DIV> 
     insertAdjacentText方法与insertAdjacentHTML方法类似,只不过只能插入纯文本,参数相同

接下来就可以用FOR循环去处理了
protected void btnCommit_Click(object sender,EventArgs e)
{
if(ddlCategory.SelectedIndex <= 0) return;
///获取上载文件的列表
HttpFileCollection fileList = HttpContext.Current.Request.Files;
if(fileList == null) return;
Album album = new Album();
try
{   ///上载文件列表中的每一个文件
   for(int i = 0; i < fileList.Count; i++)
   {   ///获取当前上载的文件
    HttpPostedFile postedFile = fileList[i];
    if(postedFile == null) continue;
    ///获取上载文件的文件名称
    string fileName = Path.GetFileNameWithoutExtension(postedFile.FileName);
    string extension = Path.GetExtension(postedFile.FileName);
    if(string.IsNullOrEmpty(extension) == true) continue;
    ///判断文件是否合法
    bool isAllow = false;
    foreach(string ext in AjaxAlbumSystem.ALLOWPHOTOFILELIST)
    {
     if(ext == extension.ToLower())
     {
      isAllow = true;
      break;
     }
    }
    if(isAllow == false) continue;    
    ///获取基于时间的文件名称
    string timeFilename = AjaxAlbumSystem.CreateDateTimeString();
    ///获取保存在数据库中的URL
    string url = "Photoes/" + timeFilename + extension;
    ///获取全路径
    string fullPath = Server.MapPath(url);
    ///上载文件
    postedFile.SaveAs(fullPath);
    ///添加文件到数据库中
    album.AddPhoto(fileName,url,postedFile.ContentType,postedFile.ContentLength,
     Int32.Parse(ddlCategory.SelectedValue));    
   }
}
catch(Exception ex)
{   ///显示上载文件的操作失败消息
   lbMessage.Text = "上载文件错误,错误原因为:" + ex.Message;
   return;

0 0
原创粉丝点击