c# js动态多文件上传,增加、删除

Question

效果这样，我要点击“添加更多附件”就增加一个如下图的上传控件
点击这个删除按钮可以删除当前上传控件及checkboxlist。
然后我一个上传控件上传一个文件--选择下面的适合项，然后通过遍历checkboxlist来得到“文件名*下载地址,Linux,Pocket PC|文件名*下载地址,Linux,Pocket PC,SmartPhone”写入一个字段...
<p id="MyFile">
                <input onclick="addFile()" type="button" value="添加更多附件" /><br />
                <input id="File1" type="file" name="File" runat="server" style="width: 200px" /> 下载名称：<input name="text" id="text1" runat="server" type="text" value="下载地址" style="width: 150px" maxlength="20" /><br />
                <!--/////////////////////////////////////////////////////////////////////////////////////////////-->
                <input type="checkbox" id="CBall1" name="CBLppxlall" value="All" onclick="checkAll(this,'CBLppxl')" />全 选<br />
                <input type="checkbox" id="CBLppxl1" name="CBLppxl" checked="checked"  value="1" onclick="checkItem(this,'CBLppxlall')" />Linux
                <input type="checkbox" id="CBLppxl2" name="CBLppxl" checked="checked"   value="2" onclick="checkItem(this,'CBLppxlall')" />Pocket PC
                <input type="checkbox" id="CBLppxl3" name="CBLppxl" checked="checked"  value="3" onclick="checkItem(this,'CBLppxlall')" />SmartPhone
                <input type="checkbox" id="CBLppxl4" name="CBLppxl" checked="checked"  value="4" onclick="checkItem(this,'CBLppxlall')" />Symbian S60              
                <input type="checkbox" id="CBLppxl5" name="CBLppxl" checked="checked"  value="5" onclick="checkItem(this,'CBLppxlall')" />Symbian S60v3<br />  
                <input type="checkbox" id="CBLppxl6" name="CBLppxl" checked="checked"  value="6" onclick="checkItem(this,'CBLppxlall')" />Symbian S90 
                <input type="checkbox" id="CBLppxl7" name="CBLppxl" checked="checked"  value="7" onclick="checkItem(this,'CBLppxlall')" />Symbian UIQ2
                <input type="checkbox" id="CBLppxl8" name="CBLppxl" checked="checked"  value="8" onclick="checkItem(this,'CBLppxlall')" />Symbian UIQ3
                <input type="checkbox" id="CBLppxl9" name="CBLppxl"  value="9" onclick="checkItem(this,'CBLppxlall')" />iPhone<br />
</p>
js代码如下：
<script>
        function checkAll(e, itemName)
        {
          var aa = document.getElementsByName(itemName);
          for (var i=0; i<aa.length; i++)
           aa[i].checked = e.checked;
        }
        function checkItem(e, allName)
        {
          var all = document.getElementsByName(allName)[0];
          if(!e.checked) all.checked = false;
          else
          {
            var aa = document.getElementsByName(e.name);
            for (var i=0; i<aa.length; i++)
             if(!aa[i].checked) return;
            all.checked = true;
          }
        }
      
        function addFile()
        {              
            var str = '<BR> <input type="file" name="File" runat="server" style="width: 200px"/> 下载名称：<input name="text" type="text" style="width: 150px" maxlength="20" value="下载地址" /> <input type=\"button\" value=\"删除\" onclick=\"dellist("+File+")\" /> <BR>'
               + '<input type="checkbox" name="CBAll1" onclick="checkAll(this,"CBLppxl1")" value="" />全 选 <br />'
               + '<input type="checkbox" name="CBLppxl1" value="1" onclick="checkItem(this,"CBAll1")" />Linux'
               + '<input type="checkbox" name="CBLppxl1" value="2" onclick="checkItem(this,"CBAll1")" />Pocket PC'
               + '<input type="checkbox" name="CBLppxl1" value="3" onclick="checkItem(this,"CBAll1")" />SmartPhone'
               + '<input type="checkbox" name="CBLppxl1" value="4" onclick="checkItem(this,"CBAll1")" />Symbian S60'               
               + '<input type="checkbox" name="CBLppxl1" value="5" onclick="checkItem(this,"CBAll1")" />Symbian S60v3 <br />'
               + '<input type="checkbox" name="CBLppxl1" value="6" onclick="checkItem(this,"CBAll1")" />Symbian S90' 
               + '<input type="checkbox" name="CBLppxl1" value="7" onclick="checkItem(this,"CBAll1")" />Symbian UIQ2'
               + '<input type="checkbox" name="CBLppxl1" value="8" onclick="checkItem(this,"CBAll1")" />Symbian UIQ3'
               + '<input type="checkbox" name="CBLppxl1" value="9" onclick="checkItem(this,"CBAll1")" />iPhone'             
            document.getElementById('MyFile').insertAdjacentHTML("beforeEnd",str)  
        } 
</scirpt>
我现在是可以添加更多附件，但不能删除当前的控件。就是不晓得怎么来遍历新增(动态添加)的上传控件、checkboxlist来写入数据库中

Answer 1

for 循环 遍历控件 获取数据

Answer 2

private Boolean SaveImages()
    {        HttpFileCollection files = HttpContext.Current.Request.Files;
        System.Text.StringBuilder strMsg = new System.Text.StringBuilder();
        strMsg.Append("上传的文件分别是：<hr color=red>");
        try
        {
            for (int iFile = 0; iFile < files.Count; iFile++)
            {
                HttpPostedFile postedFile = files[iFile];
                string fileName, fileExtension, file_id;
                int year = System.DateTime.Now.Year;
                int month = System.DateTime.Now.Month;
                int day = System.DateTime.Now.Day;
                int hour = System.DateTime.Now.Hour;
                int minute = System.DateTime.Now.Minute;
                int second = System.DateTime.Now.Second;
                int millisecond = System.DateTime.Now.Millisecond;
                //string my_file_id = year.ToString() + month.ToString() + day.ToString() + hour.ToString() + minute.ToString() + second.ToString() + millisecond.ToString() + iFile.ToString();                fileName = System.IO.Path.GetFileName(postedFile.FileName);
                fileExtension = System.IO.Path.GetExtension(fileName);
                file_id = fileName;
                if (fileName != "")
                {
                    fileExtension = System.IO.Path.GetExtension(fileName);
                    strMsg.Append("上传的文件类型：" + postedFile.ContentType.ToString() + "<br>");
                    strMsg.Append("客户端文件地址：" + postedFile.FileName + "<br>");
                    strMsg.Append("上传文件的文件名：" + file_id + "<br>");
                    strMsg.Append("上传文件的扩展名：" + fileExtension + "<br><hr>");
                    postedFile.SaveAs(System.Web.HttpContext.Current.Request.MapPath("upload/") + file_id);
                }
            }
            strStatus.Text = strMsg.ToString();
            return true;
        }
        catch (System.Exception Ex)
        {
            strStatus.Text = Ex.Message;
            return false;
        }
    }
protected void UploadButton_Click(object sender, EventArgs e)
    {
        Boolean bl = SaveImages();
        if (bl)
        {
           // adminDataBase db = new adminDataBase();
           // int l = db.Log(Session["adminName"].ToString(), "上传文件");
            Response.Write("<script>alert('上传成功！')</script>");
        }
        else
        {
            Response.Write("<script>alert('上传失败！')</script>");
        }
    }

Answer 3

<%@ Page Language="C#" AutoEventWireup="true"  CodeFile="uploadIT.aspx.cs" Inherits="_uploadIT" %><!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>
     <title>多文件上传</title>
     <script language="javascript">
     function addFile()
     {
     var str = '<INPUT type="file" size="50" NAME="File">'
     document.getElementById('MyFile').insertAdjacentHTML("beforeEnd",str)
     }
     </script>
   </head>
   <body>
     <form id="form1" method="post" runat="server" enctype="multipart/form-data">
       <div align="center">
         <h3>多文件上传</h3>
         <P id="MyFile"><input type="file" size="50" NAME="File"></P>
         <P>
           <input type="button" value="增加(Add)" onclick="addFile()">
           <input onclick="this.form.reset()" type="button" value="重置(ReSet)">
           <asp:Button Runat="server" Text="开始上传" ID="UploadButton" OnClick="UploadButton_Click"></asp:Button>
         </P>
         <P>
         <asp:Label id="strStatus" runat="server" Font-Names="宋体" Font-Bold="True" Font-Size="9pt" 
           Width="500px" BorderStyle="None" BorderColor="White"></asp:Label>
         </P>
       </div>
     </form>
   </body>
</html>
 

Answer 4

function addFile()
{
var fileBlock = document.getElementById("fileBlock");
var oDiv = document.createElement("div");
oDiv.innerHTML = "<input size=\"40\" type=\"file\" name=\"" + fileName + "\" /> "
+ "<input type=\"button\" onclick=\"delFile(this)\""
+ " value=\"删除\" />"
fileBlock.appendChild(oDiv);
}