I have an update panel in a page for the users to specify an "owner" for an event. that owner would be a user in our active directory. The panel lets the user enter some text then click on a search button to find matching users in our Active Directory. When the user selects a user from the matching list, the owner's name and username are populated. The username is kept hidden because the user does not need to see that. All of that works fine

My problem is that I have an event handler that is triggered whenever the text of the owner name is changed, if the user changes the owner name, I want to blank the owner username until the user actually brings up the matching list and selects a valid entry.

My problem is that when I try to access the value of the hidden textbox with Javascript, I cannot, but when I try jquery equivalent code, it works just fine. Why?

Here is my Html

<asp:UpdatePanel ID="OwnerUpdatePanel" runat="server" UpdateMode="Conditional" ClientIDMode="Static">
    <ContentTemplate>
        <asp:TextBox id="OwnerNameTextbox" runat="server" class="form-control input-sm" Width="200"/>
        <asp:TextBox id="OwnerUsernameTextbox" runat="server" class="hidden"/>
        <asp:LinkButton class="btn btn-default btn-sm StopClickPropagation" id="GetOwners" AutoPostBack="True" runat="server" OnClientClick="CheckLength()" OnClick="GetMatchingOwners">
            <span class="glyphicon glyphicon-search" aria-hidden="true"></span>
        </asp:LinkButton>
        <asp:ListBox id="OwnersList" runat="server" AutoPostBack="True" class="dropdown-list" onblur='$(".dropdown-list").hide();' OnSelectedIndexChanged="OwnerSelectionChanged">
        </asp:ListBox>
        <p>
    </ContentTemplate>
</asp:UpdatePanel>

And here is my handler for the ownernametextbox change event

    function OwnerNameTextChanged() {
        document.getElementById("OwnerUpdatePanel").childNodes[1].value = "";
    }

This sets my OwnerNameTextBox to blank, which is not what I want. I want to set the OwnerUsernameTextbox to blank. But when I change the subscript for childNodes to 2, nothing is changed (examining the value of childNodes[2] with an alert, gives me "undefined"). But if I try using jquery:

$("#OwnerUpdatePanel").children(":nth-child(2)").val("");

that works just fine. Why would the jquery child selection work, but not the javascript one?

Related posts

Recent Viewed