Anjali5 Anjali5 - 1 year ago 63
Javascript Question

hiding the link buttons when user leaves the text box

I have a text box and two link buttons on my web page. When I put some value on the text box, based on that value and also as soon as I leave the textbox. I want to hide or make the link button invisible.

<asp:textBox id="textBox1" runat="server">
<asp:linkButton id="link1" runat="server">
<asp:linkButton id="link2" runar="server">

when the user enter value "X" in the textbox, I want to hide Link1 and Link2 otherwise I want Link1 and Link2 to be visible.

here is my code and it is not working:

function HidePick(selectObj) {
if (selectObj.value.toUpperCase() == "D9") {
document.getElementById("LINK1").style.display = 'none';

<td><asp:TextBox ID="TXTTest1" runat="server" CssClass="cssTest" Width="30" onmouseout="javascript:HidePick(this);"

With error message:

"JavaScript runtime error: Unable to get property 'style' of undefined
or null reference

Win Win
Answer Source

For that kind of DOM manipulation, it is easy with jQuery.

JS Fiddle -

<asp:TextBox ID="textBox1" runat="server" />
<asp:LinkButton ID="link1" runat="server" Text="Button1" />
<asp:LinkButton ID="link2" runat="server" Text="Button2" />

<script src=""></script>
<script type="text/javascript">

    $(function() {
        $("#<%= textBox1.ClientID %>").blur(function () {
            if ($(this).val() === "X") {
                $("#<%= link1.ClientID %>").hide();
                $("#<%= link2.ClientID %>").hide();
Recommended from our users: Dynamic Network Monitoring from WhatsUp Gold from IPSwitch. Free Download