使用Javascript访问asp:Datalist控件中的asp:Textbox值

时间:2014-04-15 22:17:27

标签: javascript asp.net

我在访问asp:Datalist控件中的asp:textbox控件的文本值时遇到了很大困难。这是代码:

<asp:DataList id="UserIP" DataSourceID="dsGetData" runat="server" CssClass="lblText">
 <ItemTemplate>                 
<span class="lblText">IP Address:</span><br />
     <asp:TextBox ID="tbUserIP" class="textbox_medium" runat="server" AutoPostBack="false" Text='<%# Eval("[IPAddress]") %>' /></asp:TextBox>
 </ItemTemplate></asp:DataList>

我正在为Textbox分配一个SQL查询结果中的值。然后我需要使用Javascript获取该Texbox的价值。我的JavaScript代码如下:

var temp =  document.getElementById("<%= UserIP.FindControl("tbUserIP").ClientID %>");

我不断收到编译错误: 当前上下文中不存在名称“tbUserIP”

任何帮助都会受到极大的赞赏。

2 个答案:

答案 0 :(得分:1)

您的代码存在的问题是,当您致电UserIP.FindControl("tbUserIP").ClientID时,tbUserIP无效。

请注意,要访问此类控件,您必须首先通过UserIP DataList调用DataBind,然后才会调用DataBind,可能会有一些结果导致带有名为tbUserIP的文本框的行。< / p>

要解决这个问题,并且因为有很多方法可以解决这个问题,我建议你看一下: ASP.NET Page Event Life Cycle,所以你可以清楚地了解你在实现目标的过程中可能缺少哪一步。

或者,并且不依赖于ASP.NET页面处理,您可以使用javascript来处理您知道的最终结果。

这是:

  • 如果您的DataList有结果,那么您在生成的HTML中会有这样的<input type="text" id="$somecontainerid$1$tpUserIP" value="192.168.0.1"/>吗?

  • 所以,要在你的javascript上抓住它,假设你可以使用jQuery,你可以这样做:

  

//抓取id为tpUserIP(多行)的所有输入字段。

     

$ ipaddressFields = $(&#34;输入[id * = tpUserIP]&#34;);

     

//警告每一个,如果有的话,以表明它有效。

     

if($ ipaddressFields.length&gt; 0){

$ipaddressFields.each(function(){

    alert($(this).val());

});
     

}

答案 1 :(得分:1)

以下是在不使用JQuery的情况下在JavaScript中执行此操作的方法。我不确定你在哪里调用JavaScript函数。所以,我给你两个例子。即一个是单击文本框,另一个是单击按钮。

这是HTML标记

<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Test.aspx.cs" Inherits="Test" %>

<!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 src="Scripts/jquery-1.4.1-vsdoc.js" type="text/javascript"></script>
    <script src="Scripts/jquery-1.4.1.js" type="text/javascript"></script>
    <script src="Scripts/jquery-1.4.1.min.js" type="text/javascript"></script>
</head>
<body>
<script type="text/javascript">
    function Test(obj) {
        alert(obj.id); // This is the ID of the textbox clicked on
        alert(obj.value); // This is the value of the textbox clicked on
    }

    function Test2() {
        var dataListid = '<%= UserIP.ClientID %>';
        var obj = document.getElementById(dataListid);
        if (obj != 'undefined' || obj != null) {
            for (var i = 0; i < obj.getElementsByTagName('input').length; i++) { // Loop through all TextBoxes (input elements if we talk in markup language)
                alert(obj.getElementsByTagName('input')[i].value); // Here are the values of each textbox
            }
        }
    }

</script>
    <form id="form1" runat="server">
    <div>
        <asp:DataList id="UserIP"  runat="server" CssClass="lblText" >
            <ItemTemplate>                 
            <span class="lblText">IP Address:</span><br />
                <asp:TextBox ID="tbUserIP" class="textbox_medium" runat="server" AutoPostBack="false" Text='<%# String.Concat("Test", (Convert.ToInt32(Container.ItemIndex)+1))%>' onclick="Test(this);" /></asp:TextBox>
            </ItemTemplate>
        </asp:DataList>
        <asp:Button ID="Button1" runat="server" Text="Button" OnClientClick="Test2();" />
    </div>
    </form>
</body>
</html>

这是我使用的代码背后的代码。您可以使用自己的代码绑定DataList。

using System;
using System.Collections.Generic;

public partial class Test : System.Web.UI.Page
{
    protected void Page_Load(object sender, EventArgs e)
    {
        List<string> ips = new List<string>() {"1", "2", "3"};
        UserIP.DataSource = ips;
        UserIP.DataBind();

    }
}

希望这会有所帮助。

干杯!