在网页中动态添加控件实例

在网页中动态添加控件的实例

在网页中经常要动态添加控件的方法，例如上传多个文件，而具体不知道上传多少个文件，通过添加附件按钮来动态添加FileUPLoad控件。具体做法：

第一种方法：在网页中添加一个Panel1容器控件。在Panel1的容器控件中添加FileUpLoad控件。

添加一个命令按钮Button1，Button1.Text="添加附件";

后台代码：

using System;
using System.Collections;
using System.Configuration;
using System.Data;
using System.Linq;
using System.Web;
using System.Web.Security;
using System.Web.UI;
using System.Web.UI.HtmlControls;
using System.Web.UI.WebControls;
using System.Web.UI.WebControls.WebParts;
using System.Xml.Linq;

public partial class Blog_NewBlog : System.Web.UI.Page
{
    protected void Page_Load(object sender, EventArgs e)
    {
        if (!IsPostBack)
        {
            ViewState["nClick"] = 0;//定义ViewState.
        }
    }

    private void LoadFileupLoad(int n)//创建自定义方法，用于添加FileUpLoad控件。
    {
     
        FileUpload imgfile = new FileUpload();
        imgfile.ID = "FileUpload" + n.ToString().Trim();
        imgfile.Width = 500;
        this.Panel2.Controls.Add(imgfile);
    }

    protected void Button1_Click(object sender, EventArgs e)//添加附件按钮事件
    {
        if (ViewState["nClick"] != null)
        {
            for (int i = 0; i <= Convert.ToInt32(ViewState["nClick"].ToString()); i++)
            {
                LoadFileupLoad(i);//调用自定义方法。
            }
            ViewState["nClick"] = Convert.ToInt32(ViewState["nClick"].ToString()) + 1;//ViewState加1
        }
          
    }

    //引用动态添加的FileUpload控件，把上传的文件保存到服务器上，把文件信息存储到数据库中。

    protected void Button8_Click(object sender, EventArgs e)
    {
        OA jkj = new OA();//自定义类
        bool ok = false;//上传的文件是否符合要求
        string Ftype = "";//文件类型。
        string[] kzm = new string[] { ".jpg", ".tif", ".pdf", ".doc", ".xls", ".txt", ".ppt"，".rar" };//上传的文件类型
        bool cb = false;//存储插入数据的成功标记。
        jkj.StroeProName = "UP_BlogInsert";//存储过程名称
        jkj.TableName = "Blog";//保存记录的表名称。
        string bid = Guid.NewGuid().ToString();//生成一个唯一标识。
        string gk = "";
        if (RadioButton1.Checked == true)
        {
            gk = "公开";
        }
        else
        {
            gk = "私人";
        }
      
        string[,] sql = new string[,]
        {
            {"@xm",Profile.xm,"InPut"},
            {"@Btitle",jkj.HtmlCode(TextBox1.Text),"InPut"},
            {"@Bcontent",FreeTextBox1.Text,"InPut"},
            {"@ClassID",DropDownList1.SelectedValue,"InPut"},
          
            {"@Bid",bid,"InPut"},
            {"@state",gk,"InPut"},
            {"@sendto",TextBox2.Text,"InPut"}
        };
        if (jkj.ExeComm(sql, "1") == "0")
        {
            cb = true;//保存成功。

        }
        HttpFileCollection files = Request.Files;//获取动态控件FileUpload的集合。
        string fileName;//文件名
        int fsize = 0;//文件的大小
        for (int i = 0; i < files.Count; i++)
        {
            if (files[i].ContentLength <= 0)
                continue;
            Ftype = System.IO.Path.GetExtension(files[i].FileName);
            fsize = files[i].ContentLength;
            for (int x = 0; x < kzm.Length; x++)
            {
                if (Ftype.ToLower() == kzm[x])
                    ok = true;
            }
            if (ok == true)
            {
                string upfilename = DateTime.Now.ToString("yyyymmddhhmmss") + Ftype;
                string webpath = Server.MapPath("~/blog/upfiles/");
                files[i].SaveAs(webpath + upfilename);//保存上传的文件到服务器
                jkj.StroeProName = "UP_BlogFile";
                jkj.TableName = "BlogFile";
                string[,] bf = new string[,]
                    {
                        {"@bid",bid,"InPut"},
                        {"@fName",upfilename,"InPut"},
                        {"@ftype",Ftype,"InPut"},
                        {"@fsize",fsize.ToString(),"InPut"}
                    };
                if (jkj.ExeComm(bf, "1") == "0" && cb == true)
                {
                    jkj.Show("保存成功！");
                }

            }
            else
            {
                jkj.Show("上传的文件格式符合要求！");
            }
        }
    }        

}



第二种方法：使用JavaScript

页面如下：

《HTML>
     《HEAD>
     <script>          
     function AddAttachments()            {                
     document.getElementById('attach').innerText = "继续添加附件";                                  
     tb = document.getElementById('attAchments');                                  
     newRow = tb.insertRow();                
     newRow.insertCell().innerHTML = "<input name='File' size='50' type='file'>&nbsp;&nbsp;<input type=button value='删除' onclick='delFile(this.parentElement.parentElement.rowIndex)'>";          
     }          
     function delFile(index)          
     {                
     document.getElementById('attAchments').deleteRow(index);                
     tb.rows.length > 0?document.getElementById('attach').innerText = "继续添加附件":document.getElementById('attach').innerText = "添加附件";          
     }          
     </script>    
     </HEAD>    
     <body MS_POSITIONING="GridLayout">          
     <form id="form1" method="post" runat="server" enctype="multipart/form-data">          
     <div><table id="attAchments"></table></div><span><IMG src="icoAddFl.gif"> </span> <A id="attach" style="font-family:宋体;font-size:9pt;" title="如果您要发送多个附件，您只需多次点击“继续添加附件”即可, 要注意附件总量不能超过发送限制的大小。" onclick="AddAttachments();" href="javascript:;" name="attach">添加附件</A>
     <br><br><br><br><br><br>                
<asp:Button id="btnSend" runat="server" Text=" 上传 " onclick="btnSend_Click"></asp:Button>          
</form>    
《/body>《/HTML>

后台代码

protected void btnSend_Click(object sender, EventArgs e)
    {
        StringBuilder sb = new StringBuilder();

        int attCount = 0;
        string filePath = "";
        for (int i = 0; i < Request.Files.Count; i++)
        {
            if (Request.Files[i].ContentLength > 0)
            {
                filePath = Request.Files[i].FileName;
                sb.Append("Files" + attCount++ + ": " + filePath + "<br>");
                Request.Files[0].SaveAs(Server.MapPath("./") + filePath.Substring(filePath.LastIndexOf("\\") + 1));
            }
        }
        sb.Insert(0, "you upload " + attCount + " files.<br>"); Response.Write(sb.ToString());
    }