Note that there are some explanatory texts on larger screens.

plurals
  1. POBound javascript function
    text
    copied!<p>Alright my basic question is how do I simulate a button click in javascript.</p> <p>I know I have to use document.getElementById("btnSubmit").click(); but this doesn't seem to call the onClientClick javascript function as well.</p> <p>Enviorment:</p> <p>I am using ASP.NET with C# and javascript.</p> <p>What happened: I have an input text area and I want to make sure that users must enter a character before the submit button is enabled. I was able to do this with onkeypress="validateTxt();" which then called this function</p> <pre><code> function validateTxt() { var input = document.getElementById("&lt;%=txtUserName.ClientID %&gt;").value; //Need a min of 3 characters if(input.length &gt; 1) { document.getElementById("btnSubmit").disabled = false; } else { document.getElementById("btnSubmit").disabled = true; } } </code></pre> <p>The only problem though is doesn't register backspace.</p> <p>To solve this I found this online</p> <pre><code>&lt;script type="text/javascript"&gt; document.getElementsByName('txtUserName')[0].onkeydown = function (event) { if (event === undefined) event = window.event; // fix IE if (event.keyCode === 8) validateTxt(); if (event.keyCode === 13) { document.getElementById("btnSubmit").click(); } }; </code></pre> <p></p> <p>Now whenever the user presses the backspace my javascript function is called. This worked great up until I found out that when I press enter from the text area it wouldn't call my javascript function.</p> <p>Here is all of the relevant code...</p> <pre><code> &lt;script type="text/javascript"&gt; function InformUser() { window.document.getElementById("loadingMessageDIV").style.display = "block"; &lt;%=Page.GetPostBackEventReference(btnSubmit as Control)%&gt; document.getElementById("btnSubmit").disabled = true; } function validateTxt() { var input = document.getElementById("&lt;%=txtUserName.ClientID %&gt;").value; //Need a min of 3 characters if(input.length &gt; 1) { document.getElementById("btnSubmit").disabled = false; } else { document.getElementById("btnSubmit").disabled = true; } } &lt;/script&gt; </code></pre> <p>Here is the text area + javascript bounding function</p> <pre><code>&lt;asp:TextBox ID="txtUserName" runat="server" Font-Size="11pt" onkeypress="validateTxt();"&gt;&lt;/asp:TextBox&gt; &lt;script type="text/javascript"&gt; //We bind the textbox to this function and whenever the backspace key is pressed it will validateTxt document.getElementsByName('txtUserName')[0].onkeydown = function (event) { if (event === undefined) event = window.event; // fix IE if (event.keyCode === 8) validateTxt(); if (event.keyCode === 13) { document.getElementById("btnSubmit").click(); } }; &lt;/script&gt; </code></pre> <p>Here is the submit button</p> <pre><code>&lt;asp:Button ID="btnSubmit" runat="server" OnClientClick="InformUser();" OnClick="btnSubmit_Click" Text="Login" Font-Bold="True" Enabled="True" /&gt; &lt;script type="text/javascript"&gt; //Disable the button until we have some actual input document.getElementById("btnSubmit").disabled = true; &lt;/script&gt; </code></pre> <p>So to recap it does press the button, but it fails to disable it as well. I even tried to call the InformUser directly when the user presses enter and then press the button, but that didn't work either. </p> <p>I know it has something to do with how I bound the javascript function to the text area because when I take it out it works.</p> <p>Thanks for the help</p>
 

Querying!

 
Guidance

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload