快速业务通道

如何用ASP.NET实现多附件上传?

作者 佚名技术 来源 NET编程 浏览 发布时间 2012-04-10

以下为引用的内容:

protected void Page_Load(object sender, EventArgs e)
{
    
string script = string.Format("addImg($get(''{0}''), $get(''{1}''), $get(''{2}''));",
        
this.saveshoutoutimgs.ClientID,
        
this.tbImgs.ClientID,
        
this.tbOldImgs.ClientID);
    
this.btAdd.Attributes.Add("onclick", script);
}

代码建立在Ajax.net基础之上,环境是Visual Studio 2008 + Windows 2003,测试通过!

简单做一下说明:

1. <div id="saveshoutoutimg" runat="server"/>用来存放动态添加的文件相关标签。

2. btAddImage被点击后自身将被disabled掉,然后显示saveshoutoutaddimgs整个div。

3. 在saveshoutoutaddimgs中用户可以完成文件的选取和确认操作,chkAgree用来enable btAdd按钮。

4. 当用户点击btAdd时,触发onclick事件,该事件在code-behind的Page_Load方法中注册,因为脚本中涉及到使用服务端控件的ClientID属性,这样写比较方便。

5. 客户端函数addImg用来完成动态DOM的添加操作,它接收三个参数,第一个参数targetElement表示存放动态DOM的宿主DIV,第二个参数savestatsElement表示用于保存已添加文件信息的隐藏文本框,第三个参数oldimgElement表示用于保存在编辑状态下用户上一次上传的文件信息隐藏文本框。基本思路是复制browseimg下的input type="file"标签,然后将动态生成的DOM添加到saveshoutoutimgs下,并同时附加了一些事件。

6. tbImgs隐藏文本框用来保存用户已选文件的信息,以"|文件名1|文件名2|文件名3|..."的格式存放;tbOldImgs隐藏文本框中的值在编辑状态下才会得到,其中保存了用户上一次所上传文件的信息,存储格式与tbImgs相同。

7. 在编辑状态下,在服务端向saveshoutoutimgs标签添加与addImg脚本函数所生成的动态DOM相同的标签,并同时往tbOldImgs隐藏文本框中写入文件信息。我在这里写了一个示例,读者可以自己完善代码用以验证。在显示文件时我在文件的名称上添加了一个链接,这个链接所指向的页面用于输出图片,如通过得到的图片ID在数据库中检索图片的二进制数据然后Write到页面上。ImageEntity为自定义Image对象的实体类,用以存储图片文件的相关信息。

以下为引用的内容:

public void SetImages(List<ImageEntity> images)
{
    
if (images.Count > 0)
    {
        
this.tbOldImgs.Text = "|";
        
foreach (ImageEntity image in images)
        {
            HtmlGenericControl imgDiv 
= new HtmlGenericControl("Div");

            HtmlAnchor imgAnchor 
= new HtmlAnchor();
            imgAnchor.HRef 
= string.Format("Thumbnail.aspx?isthumbnail=false&basecommentid={0}&imagetitle={1}",
                image.ID.ToString(), image.Title);
            imgAnchor.Target 
= "_blank";
            imgAnchor.Title 
= image.Title;
            imgAnchor.InnerHtml 
= image.Title + "&nbsp;&nbsp;";

            HtmlImage imgButton 
= new HtmlImage();
            imgButton.Src 
= "ShoutOut_Close.gif";
            imgButton.Alt 
= "Delete";
            imgButton.Attributes[
"onclick"= string.Format("this.parentNode.parentNode.removeChild(this.parentNode);$get(''{0}'').value = updatehiddenimgs(''{1}'',$get(''{0}'').value);",
                
this.tbOldImgs.ClientID, image.Title);
            imgButton.Attributes[
"onmouseover"= "this.src=''ShoutOut_Close_rollover.gif''";
            imgButton.Attributes[
"onmouseout"= "this.src=''ShoutOut_Close.gif''";

            imgDiv.Controls.Add(imgAnchor);
            imgDiv.Controls.Add(imgButton);
            
this.saveshoutoutimgs.Controls.Add(imgDiv);
            
this.tbOldImgs.Text += image.Title + "|";
        }
    }
}

 

public class ImageEntity
{
    
public ImageEntity()
    {
    }

    
public ImageEntity(int id, string title, Byte[] imageBlob, string type)
    {
        ID 
= id;
        Title 
= title;
        ImageBlob 
= imageBlob;
        Type 
= type;
    }

    
public int ID { getset; }
    
public string Title { getset; }
    
public string Type { getset; }
    
public Byte[] ImageBlob { getset; }
}

凌众科技专业提供服务器租用、服务器托管、企业邮局、虚拟主机等服务,公司网站:http://www.lingzhong.cn 为了给广大客户了解更多的技术信息,本技术文章收集来源于网络,凌众科技尊重文章作者的版权,如果有涉及你的版权有必要删除你的文章,请和我们联系。以上信息与文章正文是不可分割的一部分,如果您要转载本文章,请保留以上信息,谢谢!

分享到: 更多

Copyright ©1999-2011 厦门凌众科技有限公司 厦门优通互联科技开发有限公司 All rights reserved

地址(ADD):厦门软件园二期望海路63号701E(东南融通旁) 邮编(ZIP):361008

电话:0592-5908028 传真:0592-5908039 咨询信箱:web@lingzhong.cn 咨询OICQ:173723134

《中华人民共和国增值电信业务经营许可证》闽B2-20100024  ICP备案:闽ICP备05037997号