访问 Html 控件时未定义答案

【问题标题】：Html control is undefined when accessing it访问 Html 控件时未定义
【发布时间】：2014-03-18 18:44:31
【问题描述】：

我有一个代码可以在单击按钮时验证 GridView 内的文本框。

这是一个代码：

function ValidateEmail(btn_id)
{
    alert(btn_id.id);
    $('#<%=lblTest.ClientID%>').text(btn_id.id);  
    var btnId = btn_id.id;
    alert($(btnId).closest("tr").id);
    return false;  
}

我在Grid 内部调用这个方法如下：

<asp:Button ID="btnEmailUpdate" Text = "Update" CommandName="UpdateEmail" runat="server" onClientClick="return ValidateEmail(this)"/>

在我尝试获取最接近的 tr 元素之前，一切看起来都很好：

alert($().closest("tr").id);

我的alert 框显示“未定义”消息。

我在这里做错了什么？

这是我的 page.aspx 和 gridview：

 <%@ Page Language="C#" MasterPageFile="~/Portal.master" AutoEventWireup="true" validateRequest="false" enableEventValidation="false" viewStateEncryptionMode ="Never" CodeFile="ISOSearch.aspx.cs" Inherits="ISOProcessing_ISOSearch" Title="ISO Search" %>  

<%@ Register Assembly="System.Web.Extensions, Version=1.0.61025.0, Culture=neutral,   PublicKeyToken=31bf3856ad364e35"
Namespace="System.Web.UI" TagPrefix="asp" %>   


<asp:Content ID="Content1" ContentPlaceHolderID="HeadContent" Runat="Server">

<script src="../shared/jquery-1.4.2.min.js"   type="text/javascript"></script>

<script type="text/javascript">  


function ValidateEmail(btnObj)
{

    alert(btnObj);
    alert(btnObj.id);
    alert($(btnObj).closest("tr").attr("id"));
    return false;

}      
</script>    


</asp:Content>

<asp:Content ID="Content2" ContentPlaceHolderID="ContentLeft" Runat="Server">
</asp:Content>

<asp:Content ID="Content3" ContentPlaceHolderID="ContentMain" Runat="Server">

<asp:UpdatePanel ID="ISOSearchUpdatePanel" runat="server">
<ContentTemplate>
<div id="divIsoSelect" style="width:700px; height:60px; background-color:white">

    <fieldset>
        <legend style="font-size: larger; font-weight: bold">Search ISO by</legend>
 <table>
    <tr>
        <td><asp:DropDownList ID="ddlISOSearch" runat="server" AutoPostBack="true" OnSelectedIndexChanged="ddlISOSearch_SelectedIndexChanged">
            <asp:ListItem Value="">Select...</asp:ListItem>
            <asp:ListItem Value="ISO Number" >ISO Number</asp:ListItem>
            <asp:ListItem Value="Name">Name</asp:ListItem>
            <asp:ListItem Value="Region" >Region</asp:ListItem>
            <asp:ListItem Value="Division">Division</asp:ListItem>                
       </asp:DropDownList></td>
    <td >&nbsp;</td>
    <td>
        <asp:Panel ID="pnlSearchEntry" runat="server" Visible="false" style="width:500px; border:gainsboro; border-width: thick;">
            <table>
            <tr>
                <td valign="middle" style="width:120px"><asp:Label ID="lblEntry" runat="server" Text=""></asp:Label></td>

                <td valign="top"><asp:TextBox ID="txtSearchValue" runat="server"></asp:TextBox></td>

                <td valign="top">&nbsp;&nbsp;<asp:Button ID="btnFind" runat="server" Text="Select" OnClick="btnFind_Click"/></td>
            </tr>
            </table>
        </asp:Panel>
    </td>
    </tr>
</table>               
</fieldset>
</div>



        <div>    
        <p> 
        <asp:Label ID="lblTest" runat="server" style="position:absolute; left: 221px; top: 100px;"></asp:Label></p>
        <asp:Label ID="lblMsg" runat="server" style="position:absolute; left: 221px; top: 105px;"></asp:Label></p>
        </div>

            <asp:GridView ID="grvIsoSearchResults" runat="server" 
                AutoGenerateColumns="False" PageSize="15"
                AllowPaging = "true" Visible="true"  BorderColor="Red" GridLines="Both"
                OnRowCommand="grvIsoSearchResults_RowCommand"
                DataKeyNames="isonum" 
                OnPageIndexChanging="grvIsoSearchResults_PageIndexChanging"
                style="position:absolute; top: 120px;">
                <PagerSettings FirstPageText="First" LastPageText="Last" NextPageText="Next" PageButtonCount="100" />
                <Columns>
                   <asp:TemplateField HeaderText="ISONUM" SortExpression="isonum">
                        <ItemTemplate>
                            <asp:Label ID="txtgvIsoNum" Text = '<%# Eval("ISONUM")%>' runat="server" Width="70px" style="text-align:center" />
                        </ItemTemplate>
                    </asp:TemplateField>
                    <asp:TemplateField HeaderText="OFFICE NAME" SortExpression="isoofficename">
                        <ItemTemplate>
                            <asp:Label ID="txtgvIsoOfficeName" Text = '<%# Eval("ISOOFFICENAME")%>' runat="server" Width="200px" style="text-align:center" />
                        </ItemTemplate>
                    </asp:TemplateField>
                    <asp:TemplateField HeaderText="REGION" SortExpression="region">
                        <ItemTemplate>
                            <asp:Label ID="txtgvRegion" Text = '<%# Eval("REGION")%>' runat="server" Width="50px" style="text-align:center" />
                        </ItemTemplate>
                    </asp:TemplateField> 
                    <asp:TemplateField HeaderText="DIVISION" SortExpression="client_id">
                        <ItemTemplate>
                            <asp:Label ID="txtgvDivision" Text = '<%# Eval("CLIENT_ID")%>' runat="server" Width="50px" style="text-align:center" />
                        </ItemTemplate>
                    </asp:TemplateField>
                    <asp:TemplateField HeaderText="EMAIL ADDRESS">
                        <ItemTemplate>
                            <asp:TextBox ID="txtgvEmailAddress" Text = '<%# Eval("EMAIL")%>' runat="server" Width="200px" />                                                                  
                            <asp:Button ID="btnEmailUpdate" Text = "Update" runat="server" CommandName="UpdateEmail" onClientClick="return ValidateEmail(this)" />
                        </ItemTemplate>
                    </asp:TemplateField>
                </Columns>
                <pagerstyle backcolor="#005482" ForeColor="White" height="30px" verticalalign="Bottom" horizontalalign="Center"/>
            </asp:GridView> 
            <asp:ValidationSummary ID="validationSummary" runat="server"  ShowMessageBox="false" ShowSummary="true"/>

 </ContentTemplate>
 </asp:UpdatePanel>
<asp:UpdateProgress ID="UpdateProgress1" runat="server">
<ProgressTemplate>
        Please Wait.....
</ProgressTemplate>
</asp:UpdateProgress>
</asp:Content>

【问题讨论】：

标签： javascript jquery asp.net

【解决方案1】：

尝试：

<table>
    <tr id="stack">
        <td><input type=button value="Go" id="test" /></td>
    </tr>
</table>




$("#test").click(function() {
         alert($(this).attr("id"))
         alert($(this).closest("tr").attr("id"));


})

【讨论】：

我将按钮对象传递给我的方法。我想我不需要在你的例子中使用this。我可以简单地使用btnId。当我使用$(this) 时，我的警报中会出现undefined。当我使用$(btnId) 时，我得到一个没有任何东西的空警报框
我不这样做，因为我需要从该方法返回 false/true。基于此，我的命令将/不会在代码后面执行
你的TD有身份证吗？

【解决方案2】：

要获取任何标签的值，请使用以下代码

$("selector").attr("property_name")

所以要得到如下效果

alert($(btnId).closest("tr").id);

使用

alert($(btnId).closest("tr").attr("id"));

这是验证函数的 jquery 等效代码

$("#btn_id").click(function() {
    //alert(btn_id.id);
    alert($(this).attr("id"))
    var btnId = $(this).attr("id");  
    //alert($(btnId).closest("tr").id);
     alert($(this).closest("tr").attr("id"));
    return false;  
})
//include $('#<%=lblTest.ClientID%>').text(btn_id.id);  accordingly

检查这个fiddle

【讨论】：

也提供 html .. 这样我就可以创建一个小提琴并向你展示
它在小提琴中工作。但是当来到我的网站时，警报不会以某种方式显示tr 的ID。为了呈现它，我应该在页面上定义我的网格有什么特定的方法吗？

【解决方案3】：

首先在您的 html 代码中更改为：onClientClick=ValidateEmail($(this))

<asp:Button ID="btnEmailUpdate" Text = "Update" CommandName="UpdateEmail" runat="server" onClientClick="return ValidateEmail($(this))"/>

然后是 Jquery：

 //the parameter will be the button object itself.
        function ValidateEmail(btnObj)
            {

                 alert(btnObj.closest("tr").attr('id'));
//replace the "txtName" with the id of the textbox whose value you need to validate.
    alert(btnObj.closest("tr").find('input[id*="txtName"]').val());

alert(btnObj.prev().val());//将给出电子邮件地址文本框“txtgvEmailAddress”的值返回错误;
}

编辑：更多解释 '.id' 属性适用于 javascript 对象，在您的代码中 btn_id 是按钮的 javascript 对象（因为使用 'this' 而不是 $(this)），所以 btn_id.id 将起作用。但是 $(btnId).closest("tr") 将创建 tr 的 jquery 对象，并且 '.id' 属性不可用，但您需要使用 .attr('id') 代替。希望这能为你清除它..!!

编辑：添加了获取特定行文本框值的代码，获取电子邮件地址文本框值的代码

【讨论】：

@eugene 你不需要按钮的 id 来获得最接近的 'tr'。在我的回答中，如果你仍然想获得 id，你应该使用 btnObj.attr('id') ，因为 btnObj.id 是 javascript 对象属性，但在我的回答中 btnObj 是 jquery 对象。
现在我得到一个空的警告框
你能把你的html添加到问题中吗？请确保最近的tr在html代码中有一个id。
我认为我生成的行没有 id 或其他东西。我收到一个空警报框
你能告诉我在这种情况下你为什么要获取 id 吗？您知道要验证的那一行中文本框的 id 吗？如果您可以将 gridview html 添加到问题中会很有帮助

【解决方案4】：

我解决了这个问题。以下是带有答案的帖子的链接：

这是答案的链接：

How to get value of textbox inside of gridview

我的问题是我的 GridView 没有生成它的 html，所以我不确定如何遍历 DOM 来获得我需要的值。在终于看到 DOM 之后，我能够将我的 html 发布到这个论坛并得到了正确的答案。

【讨论】：