ASP.NET 动态创建文本框 TextBox (add TextBox to page dynamically)

下面的函数每执行一次就生成一个TextBox（其实是<input type="Text">）

我们来之行它:点击以下就添加一个TB：

好，文本框是显示出来了，但它是在客户端生成的，不能保存状态，跟服务端无法直接沟通，它们的值我们怎么来取呢？——Hidden Field，老办法。。。

<asp:HiddenField ID="Skills" runat="server" />

function getValues()
    {
        document.getElementById("Skills").value=document.getElementById(‘skill1‘).value+"|";
        document.getElementById("Skills").value+=document.getElementById(‘skill2‘).value+"|";
        document.getElementById("Skills").value+=document.getElementById(‘skill3‘).value+"|";
        document.getElementById("Skills").value+=document.getElementById(‘skill4‘).value+"|";
        document.getElementById("Skills").value+=document.getElementById(‘skill5‘).value+"|";
        window.alert(document.getElementById("Skills").value);
    }

这样，就把这些TEXTBox们的值存入了Hidden Field，我们在服务端取一下看看：

<asp:Button ID="Button3" OnClientClick="javascript:getValues();" runat="server"
Text="get from client-side" onclick="Button3_Click"/>

protected void Button3_Click(object sender, EventArgs e)
    {
        string val=this.Skills.Value;
        Response.Write(val);
    }

取出来了：

全部代码在此：

<%@ 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>Untitled Page</title>

    <script language="javascript" type="text/javascript">
    var i=0;
    function changeIt()
    {
    if(i<5)
    {
        i=i+1;
        skils=‘skill‘+i;
        my_div.innerHTML = my_div.innerHTML +" <input type=‘text‘ id=‘" + skils + "‘>";
    }
    else
    {
    }
    }
    function getValues()
    {
        document.getElementById("Skills").value=document.getElementById(‘skill1‘).value+"|";
        document.getElementById("Skills").value+=document.getElementById(‘skill2‘).value+"|";
        document.getElementById("Skills").value+=document.getElementById(‘skill3‘).value+"|";
        document.getElementById("Skills").value+=document.getElementById(‘skill4‘).value+"|";
        document.getElementById("Skills").value+=document.getElementById(‘skill5‘).value+"|";
        window.alert(document.getElementById("Skills").value);
    }
    </script>

</head>
<body>
    <form id="form1" runat="server">
    <div>
        <asp:HiddenField ID="Skills" runat="server" />
        <a id="addSkills" href="javascript:changeIt();">Add More</a>
        <asp:Button ID="Button3" OnClientClick="javascript:getValues();" runat="server"
            Text="get from client-side" onclick="Button3_Click"
           />
        <div id="my_div">
        </div>
    </div>
    </form>
</body>
</html>

using System;
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 _Default : System.Web.UI.Page
{
    protected void Page_Load(object sender, EventArgs e)
    {

    }
    protected void Button3_Click(object sender, EventArgs e)
    {
        string val=this.Skills.Value;
        Response.Write(val);
    }
}

时间： 2024-10-12 03:17:09

ASP.NET 动态创建文本框 TextBox (add TextBox to page dynamically)

ASP.NET 动态创建文本框 TextBox (add TextBox to page dynamically)的相关文章

Asp.net中使用文本框的值动态生成控件的方法

使用Htmlhelper,创建文本框TextBox

MVC动态添加文本框,后台使用FormCollection接收

通过js动态生成文本框，怎么把文本框中的值传到java后台?

JS实现动态提示文本框可输入剩余字数(类似发表微博数字提示)

word中创建文本框

ASP.Net动态创建GridView

通过jquery来实现文本框和下拉框动态添加效果，能根据自己的需求来自定义最多允许添加数量，实用的jquery动态添加文本框特效

根据文本内容动态计算文本框高度的步骤