JS实现多附件上传（asp.net）
前几天，用户提出一个需求-多附件上传,另外，每个上传文件要加一个别名,本人创新少，从网上收集了资料，稍微改写，满足了
客户的需求。在应用到程序之前，先做了个小测试，测试通过，小高兴，就记录下了这个小测试。
一.测试效果
1.主界面
2.点击添加附件
3.点开始上传
二.实现
本文的主程序是Main.aspx ，附件上传为Default.aspx,上传的文件放在images文件夹下面
2.程序代码
1.Main.aspx前台程序
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Main.aspx.cs" Inherits="Main" %> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title></title> <script language="javascript" type="text/javascript"> function addFile(ret) {
var fileNameAndRemark=ret.toString().split("|");
var fileName=fileNameAndRemark[].toString().split("*");
var Remark=fileNameAndRemark[].toString().split("*");
for(var i=;i<fileName.length;i++)
{
var div = document.createElement("div");
var a = document.createElement("input");
a.setAttribute("type", "text");
a.setAttribute("size", "");
a.setAttribute("name", "filename");
a.setAttribute("value", Remark[i]);
a.setAttribute("readonly", "true");
div.appendChild(a);
var b = document.createElement("label");
b.innerText = "---";
div.appendChild(b);
var c = document.createElement("input");
c.setAttribute("type", "text");
c.setAttribute("size", "");
c.setAttribute("name", "remark");
c.setAttribute("value", fileName[i]);
c.setAttribute("readonly", "true");
div.appendChild(c);
var d = document.createElement("input");
d.setAttribute("type", "button")
d.setAttribute("onclick", "deteFile(this)");
d.setAttribute("value", "移除")
div.appendChild(d);
document.getElementById("container").appendChild(div);
}
}
function deteFile(o) {
while (o.tagName != "DIV") o = o.parentNode;
o.parentNode.removeChild(o);
}
// <!CDATA[ function Button1_onclick() {
var returnval = window.showModalDialog("Default.aspx", "", "dialogWidth=750px, dialogHeight=500px, , status=no,toolbar=no,menubar=no,scrollbars=yes,resizable=yes");
addFile(returnval);
}
// ]]>
</script>.
</head>
<body>
<form id="form1" runat="server">
<div> <input id="Button1" type="button" value="添加附件" onclick="return Button1_onclick()" />
</div>
<div id="container">
</div>
<div>
<asp:Button ID="btnInStorage" runat="server" OnClientClick="validate()" onclick="btnInStorage_Click"
Text="入库 " />
</div>
</form>
</body>
</html>
2. Main的后台程序
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls; public partial class Main : System.Web.UI.Page
{
protected void Page_Load(object sender, EventArgs e)
{ }
protected void btnInStorage_Click(object sender, EventArgs e)
{
var FileNames=Request.Form["filename"];
var Remarks = Request.Form["remark"];
}
}
3.Default的前台程序
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default.aspx.cs" Inherits="_Default" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title></title>
<base target="_self" />
<script language="javascript" type="text/javascript">
function addFile() {
var div = document.createElement("div"); var g = document.createElement("label");
g.innerText = "备注:";
div.appendChild(g);
var e = document.createElement("input");
e.setAttribute("type", "text");
e.setAttribute("size", "");
e.setAttribute("name", "remark");
e.setAttribute("runat", "server");
div.appendChild(e);
var f = document.createElement("input");
f.setAttribute("type", "file")
f.setAttribute("name", "File")
f.setAttribute("runat", "server");
f.setAttribute("size", "")
div.appendChild(f)
var d = document.createElement("input");
d.setAttribute("type", "button")
d.setAttribute("onclick", "deteFile(this)");
d.setAttribute("value", "移除")
div.appendChild(d); document.getElementById("_container").appendChild(div);
}
function deteFile(o) {
while (o.tagName != "DIV") o = o.parentNode;
o.parentNode.removeChild(o);
} function Save() {
var filenames = document.getElementById("HFFileNames").value;
var Remarks = document.getElementById("HFRemarks").value;
window.returnValue = Remarks + "|" +filenames;
window.close();
}
</script>
</head>
<body>
<form id="form1" runat="server" >
<h3>多文件上传</h3>
<div id="_container">
<label>备注:</label><input type="text" id="remark" runat="server" size="" /> <input id="File1" type="file" size="" name="File" runat="server"/>
</div>
<div>
<input type="button" value="添加文件" onclick="addFile()" /> </div>
<div style="padding:10px 0">
<asp:Button runat="server" Text="开始上传" ID="UploadButton"
onclick="UploadButton_Click"></asp:Button>
</div>
<input type="hidden" runat="server" id="HFFileNames" />
<input type="hidden" runat="server" id="HFRemarks" />
</form>
</body>
</html>
4.Default的后台程序
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls; public partial class _Default : System.Web.UI.Page
{
protected void Page_Load(object sender, EventArgs e)
{ }
protected void UploadButton_Click(object sender, EventArgs e)
{ String[] Remarks= Request.Form["remark"].Split(',');
HttpFileCollection files = HttpContext.Current.Request.Files;
try
{
for (int iFile = ; iFile < files.Count; iFile++)
{
///'检查文件扩展名字
HttpPostedFile postedFile = files[iFile];
string fileName;
fileName = System.IO.Path.GetFileName(postedFile.FileName);
if (fileName != "")
{
HFFileNames.Value =HFFileNames.Value+fileName+"*";
HFRemarks.Value = HFRemarks.Value + Remarks[iFile] + "*";
postedFile.SaveAs(System.Web.HttpContext.Current.Request.MapPath("images/") + fileName);
} }
if (HFFileNames.Value.Length > )
{
HFFileNames.Value = HFFileNames.Value.Substring(, HFFileNames.Value.Length - );
}
if (HFRemarks.Value.Length > )
{
HFRemarks.Value = HFRemarks.Value.Substring(, HFRemarks.Value.Length - );
}
AssetTool.JavaScriptTool.AlertMsgAndExeAFunction(this, "上传成功!", "Save()");
}
catch (System.Exception Ex)
{
AssetTool.JavaScriptTool.AlertMsg(this, Ex.Message);
}
}
}
5.关于上传后附件的备注和附件名字问题
附件名字列表：var FileNames=Request.Form["filename"];
备注列表：var Remarks = Request.Form["remark"];
JS实现多附件上传（asp.net）的更多相关文章
- asp.net结合uploadify实现多附件上传
1.说明 uploadify是一款优秀jQuery插件,主要功能是批量上传文件.大多数同学对多附件上传感到棘手,现将asp.net结合uploadfiy如何实现批量上传附件给大家讲解一下,有什么不对的 ...
- 基于MVC4+EasyUI的Web开发框架形成之旅--附件上传组件uploadify的使用
大概一年前,我还在用Asp.NET开发一些行业管理系统的时候,就曾经使用这个组件作为文件的上传操作,在随笔<Web开发中的文件上传组件uploadify的使用>中可以看到,Asp.NET中 ...
- 基于MVC4+EasyUI的Web开发框架形成之旅(4)--附件上传组件uploadify的使用
大概一年前,我还在用Asp.NET开发一些行业管理系统的时候,就曾经使用这个组件作为文件的上传操作,在随笔<Web开发中的文件上传组件uploadify的使用>中可以看到,Asp.NET中 ...
- （转）基于MVC4+EasyUI的Web开发框架形成之旅--附件上传组件uploadify的使用
http://www.cnblogs.com/wuhuacong/p/3343967.html 大概一年前,我还在用Asp.NET开发一些行业管理系统的时候,就曾经使用这个组件作为文件的上传操作,在随 ...
- ueditor调用其中的附件上传功能
ueditor实际上是集成了webuploader, 在做内容发布的时候想既有ueditor又有单独的附件上传按钮,这时再加载一个webuploader就显得过于臃肿了,单独利用ueditor的上传功 ...
- 百度在线编辑器UEditor(v1.3.6) .net环境下详细配置教程之更改图片和附件上传路径
本文是接上一篇博客,如果有疑问请先阅读上一篇:百度在线编辑器UEditor(v1.3.6) .net环境下详细配置教程 默认UEditor上传图片的路径是,编辑器包目录里面的net目录下 下面就演示如 ...
- 使用plupload做一个类似qq邮箱附件上传的效果
公司项目中使用的框架是springmvc+hibernate+spring,目前需要做一个类似qq邮箱附件上传的功能,暂时只是上传小类型的附件 处理过程和解决方案都需要添加附件,处理过程和解决方案都可 ...
- Dynamic CRM 2013学习笔记（十三）附件上传 / 上传附件
上传附件可能是CRM里比较常用的一个需求了,本文将介绍如何在CRM里实现附件的上传.显示及下载.包括以下几个步骤: 附件上传的web页面 附件显示及下载的附件实体 调用上传web页面的JS文件 实体上 ...
- playframework中多附件上传注意事项
playframework中多附件上传注意事项 2013年09月24日 play 暂无评论 //play版本问题 经确认,1.0.3.2版本下控制器中方法参数 List<File> fi ...
随机推荐
- tomcat服务器上webapps里的文件名和项目名称不一样，修改方法
第一种方法:打开工程所在目录,找到一个 .mymetadata的文件,用记事本等打开,内容大致如下: <?xml version="1.0" encoding="U ...
- javascript与服务器2
一, 通过IE建立XMLHTTP请求 这种请求方式源自与微软创建了XMLHTTP请求对象,只要用户的机器上安装了MSXML就可以发送XMLHTTP请求来创建客户端和服务器端的通信, XMLHTTP请求 ...
- ie6下使用js替换img标签src属性图片不显示的错误
首先,我必须再次强调一下,F-U-C-K I-E! 其次,简单阐述一下这个bug的出现的情况.页面中有个<a href=”javascript:void(0)” onclick=”swapImg ...
- 50行代码仿backbone_todos
<!doctype html> <html> <head> <meta charset="utf-8"> <title> ...
- Java Filter过滤器的简单总结
1.Filter的介绍 Filter技术是servlet 2.3新增加的功能.它能够对Servlet容器的请求和响应对象进行检查和修改. Filter本身并不生成请求和响应对象,只是提供过滤功能. F ...
- 《疯狂Java：突破程序员基本功的16课》读书笔记-第二章 对象与内存控制
Java内存管理分为两个方面:内存分配和内存回收.这里的内存分配特指创建Java对象时JVM为该对象在堆内存中所分配的内存空间.内存回收指的是当该Java对象失去引用,变成垃圾时,JVM的垃圾回收机制 ...
- javaEE规范和SSH三大框架到底有什么关系
转自博客:http://blog.csdn.net/bingjing12345/article/details/20641891 1994-2000 年是互联网的大航海时代. 请注意,下面的时间点及其 ...
- C# 中的多线程
参考网站http://blog.gkarch.com/topic/threading.html
- hihocoder 1154 Spring Outing
传送门 #1154 : Spring Outing 时间限制:20000ms 单点时限:1000ms 内存限制:256MB 描述 You class are planning for a spring ...
- char*和char []
1.char *s1 = "ssss"; 2.char s2[] = "bbbb"; 对于第一种,我是无法理解,无法想象字符串赋值给一个char类型的指针,查了 ...