Question

I am relatively new to the realm of programming and here is a beginner question.
I have a textbox and a submit button in an aspx page, while trying to obtain some information from users on a page.

Now, I only want to show the submit button if a user enters text into the textbox else just hide it.

I thought that the onKeyDown or onKeyEvent should help me do it, but it doesnt work right. The button only shows after I enter 2 characters and does not hide unless I hit backspace again after having deleted the last character in the box. I do not want to use the <input tags and be able to work with the <asp:Button and Textbox tags.

CODE:

<asp:UpdatePanel ID="UpdatePanel1" runat="server">
<ContentTemplate> 

<asp:TextBox ID="TextBox" onKeyDown = "showAndHide()" runat="server" Height="95px" Width="340px" 
    CssClass="SuggestionTxtBox" TextMode="MultiLine" 
    ToolTip="Enter your Suggestion here...." BorderStyle="Ridge" 
    ontextchanged="TextBox_TextChanged"></asp:TextBox>

<br />
<asp:Button ID="Button" runat="server" Text="Submit" 
    CssClass="SuggestionSubmitButton" onclick="Button_Click" 
    onclientclick="  " BackColor="#F5F5F5" Font-Size="13px" 
    ForeColor="#030756" Font-Bold="true" BorderStyle="None" Visible="False"  />
<br />
<asp:Label ID="Label2" runat="server" Text="" CssClass="SuggestionFootNote"                                                                           ForeColor="#030756"   Font-Italic="True" Font-Size="12px"></asp:Label>
<p>
&nbsp;</p>

<input type="text" id="input1" onkeydown="showAndHide();" /> 
<input type="submit" id="submit" style="display: none;" /> 


<script type="text/javascript">

inputOne = document.getElementById("input1");

inputSubmit = document.getElementById("submit");

function showAndHide() {
    if (inputOne.value == "") {
        inputSubmit.style.display = "none";
    }
    else {
        inputSubmit.style.display = "block";
    }
} 

</script> 
</ContentTemplate>
</asp:UpdatePanel>'

Answer 1

please use OnKeyUp instead of onkeydown

If it is ASP.Net Button and Textbox then use

inputOne = document.getElementById("<%= TextBox1.ClientID %>");

inputSubmit = document.getElementById("<%= Button1.ClientID %>");

In the pageload

If(!IsPostBack)
{
    Button1.Attributes.Add("OnKeyUp","showAndHide();");
    Button1.Style.Add("display","none");
}