`

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

    博客分类:
  • .NET
阅读更多
在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;
  }
分享到:
评论

相关推荐

    ASP.NET 2.0入门经典(第4版) (中文版)PDF

    ● 浏览一个由ASP.NET 2.0构建的站点的动态功能 ● 理解创建ASP.NET 2.0页面(ASPX)将要使用的工具—— Visual Web Developer Express(VWD) 。。。。。。 目录: 目录: 第1章 ASP.NET 2.0和Wrox United 应用程序...

    ASP.NET 2.0高级编程(第4版) 4/6

    ASP.NET中类的数量翻了一倍还多,而且这个版本还包含50多个新的服务器控件。本书介绍这些新技术,除了论述这些新主题外,还列举了它们的例子。 本书在全面介绍了ASP.NET各种编程技能和2.0版中的巨大变化,并详细阐述...

    ASP.NET v2.0入门经典中英文 源码(DOC) ASP.NET.rar

    ASP.NET 2.0在Web应用程序开发方面迈出了革命性的一步,新增了50多个服务器控件,类的数量也增加了一倍,其他许多方面也有很重大的变化。ASP.NET 2.0的目标是提高开发人员的效率、改善应用程序的性能和可伸缩性。...

    ASP.NET 2.0 数据库入门经典(第4版).rar

    以前使用ASP.NET的第一个版本程序员需要花费几个小时才能做出的页面,现在使用ASP.NET 2.0只需要几分钟就完成了。简单来说,在.NET Framework 2.0最终版本发布之后,任何继续使用第一个版本创建ASP.NET页面的程序...

    微软推出的asp.net2.0经典范例

    微软刚推出了基于ASP.NET 2.0下的Pet Shop 4, 该版本有了一个全新的用户界面。是研究ASP.NET 2.0的好范例啊,大家都知道,一直以来,在.NET和Java之间争论不休,到底使用哪个平台开发的企业级应用性能最好、结构最优...

    asp.net 2.0 基础知识

    Microsoft 在 ASP.NET 2.0 中引入大量的新功能,可将 ASP.NET 2.0 的目的归纳为一句话: 提高开发人员的生产率,并极大地减少开发人员必须编写的代码行数。许多常见任务只需几行 代码就能完成,甚至不需代码。 ...

    ASP.NET第一步(基于C#和ASP.NET 2.0)随书源码光盘原样复制

    ASP.NET第一步(基于C#和ASP.NET 2.0)的随书源码,包含了本书各章中出现的所有程序的源代码:  1.对于ASP.NET 2.0的网站项目,没有项目文件,直接使用IDE打开网站目录即可。  2.对于控制台应用程序或者包含多个...

    asp.net 2.0技术内幕(中文版)7

    一共33MB多。分了7个包。 微软技术丛书系列: asp.net 2.0技术内幕(中文版) 清华大学出版社

    ASP.NET 2.0技术详解与应用实例 源码

    本书详细地介绍了ASE.NET 2.0新技术在Web开发方面的具体实现。通过自定义Provider模型说明...其中,“14”文件夹中提供了Access版本的Provider示例模型,beerhouse文件夹中是一个多项目解决方案示例代码,供大家参考。

    Asp.net 2.0高级编程第一章

    ASP.NET 2.0新增了50多个新服务器控件,类的数量也翻了一倍,其他许多方面也有很大的变化。本书介绍了ASP.NET 2.0中的每个新增特性和功能,以便读者把这些新技术应用于实践。.. 本书主要内容 ● 服务器控件的...

    ASP.NET 2.0+SQL SERVER热门网络应用开发详解 光盘

    本书介绍利用ASP.NET 2.0和SQL Server开发典型网络应用系统的必备知识,重点介绍ASP.NET 2.0的核心控件与使用方法,以及能够提高开发效率的.NET框架——NSpring、NHibernate等。针对现在热门的Web 2.0的开发,本书也...

    Asp.net 2.0高级编程第二章

    ASP.NET 2.0新增了50多个新服务器控件,类的数量也翻了一倍,其他许多方面也有很大的变化。本书介绍了ASP.NET 2.0中的每个新增特性和功能,以便读者把这些新技术应用于实践。.. 本书主要内容 ● 服务器控件的...

    ASP.NET 2.0高级编程 第四章

    ASP.NET 2.0新增了50多个新服务器控件,类的数量也翻了一倍,其他许多方面也有很大的变化。本书介绍了ASP.NET 2.0中的每个新增特性和功能,以便读者把这些新技术应用于实践。.. 本书主要内容 ● 服务器控件的...

    在ASP.NET 2.0中操作数据:使用DataList来一行显示多条记录

    在ASP.NET 2.0中操作数据:使用DataList来一行显示多条记录

    ASP.NET 2.0高级编程(第4版) 5/6

    ASP.NET中类的数量翻了一倍还多,而且这个版本还包含50多个新的服务器控件。本书介绍这些新技术,除了论述这些新主题外,还列举了它们的例子。 本书在全面介绍了ASP.NET各种编程技能和2.0版中的巨大变化,并详细阐述...

    ASP.NET 2.0高级编程(第4版) 1/6

    ASP.NET中类的数量翻了一倍还多,而且这个版本还包含50多个新的服务器控件。本书介绍这些新技术,除了论述这些新主题外,还列举了它们的例子。 本书在全面介绍了ASP.NET各种编程技能和2.0版中的巨大变化,并详细阐述...

    ASP.NET 2.0高级编程(第4版) 6/6

    ASP.NET中类的数量翻了一倍还多,而且这个版本还包含50多个新的服务器控件。本书介绍这些新技术,除了论述这些新主题外,还列举了它们的例子。 本书在全面介绍了ASP.NET各种编程技能和2.0版中的巨大变化,并详细阐述...

    《零基础学ASP.NET 2.0》第13章 ADO.NET 2.0对象

    13.5.6 多个DataAdapter对象填充同一DataSet 233 13.5.7 将不同的查询填充到同一DataSet 235 13.5.8 合并DataSet 237 13.5.9 复制DataSet 240 13.6 配置应用程序 243 13.7 常见问题 244 13.7.1 介绍Connection对象时...

    ASP.NET 2.0+SQL Server 2005全程指南-源代码

    ASP.NET 2.0+SQL Server 2005全程指南 目录 基础篇 第1章 ASP.NET概述及环境配置 1.1 认识ASRNET 1.1.1 .NET Framework框架 1.1.2 ASP.NET功能与特性 1.1.3 ASP.NET与ASP的区别 1.2 搭建ASP.NET开发环境 1.2.1...

Global site tag (gtag.js) - Google Analytics