How to Click on a Button when enter pressed in Textbox using Javascript

Hi Experts,

I would like a button to be clicked on when a user presses enter in a textbox.

I'm having difficulty in determining why the following code doesn't work? Clicking on the button itself works ok, but pressing enter has no effect.

Any ideas? Thanks in advance.

Regards
Rob
<html xmlns="http://www.w3.org/1999/xhtml" >
<head runat="server">
<script type="text/javascript" language="javascript">
    function checkKeys() {
        if (window.event.keyCode == 13){
            document.getElementById('Button1').click();
        }
    }
</script>
</head>
<body>
    <form id="form1" runat="server">
    <div>
        <asp:TextBox ID="TextBox_SearchTerm" runat="server" onkeypress='checkKeys();' />
        <asp:Button ID="Button1" runat="server" Text="Go" />
    </div>
    </form>
</body>
</html>
 
Code Behind:
 
    Protected Sub Button1_Click(ByVal sender As Object, ByVal e As System.EventArgs) Handles Button1.Click
        Response.Write("Button clicked")
    End Sub

Open in new window

rwarcupAsked:
Who is Participating?
I wear a lot of hats...

"The solutions and answers provided on Experts Exchange have been extremely helpful to me over the last few years. I wear a lot of hats - Developer, Database Administrator, Help Desk, etc., so I know a lot of things but not a lot about one thing. Experts Exchange gives me answers from people who do know a lot about one thing, in a easy to use platform." -Todd S.

LordOfPortsCommented:
The ID of the button most likely changes after the form is processed. Try running in page in the brower, view its source, find the button and write down the ID that is generated. Then change the 'Button1' value in the following line of the checkKeys function

document.getElementById('Button1').click();

by updating 'Button1' to the ID generated on the client side.
0
rwarcupAuthor Commented:
Thanks LordOfPorts,

The html that is rendered is:

<input type="submit" name="Button1" value="Go" id="Button1" />

So I'm not sure what I'm missing. Any other ideas?

Kind Regards
Rob
0
NazoUKCommented:
I got mixed results when I tried your code, sometimes it worked sometimes it didn't.
According to this article http://aspnet.4guysfromrolla.com/articles/060805-1.aspx the problem may be related to the way IE submits forms when there is only one textbox on the page, it doesn't always post the control that initiated the form submit, thus asp.net doesn't know which control event to fire. They suggest putting a 2nd textbox on the page but hidden using css. Bit of a kludge but that's IE for you I guess.
0
The Ultimate Tool Kit for Technolgy Solution Provi

Broken down into practical pointers and step-by-step instructions, the IT Service Excellence Tool Kit delivers expert advice for technology solution providers. Get your free copy for valuable how-to assets including sample agreements, checklists, flowcharts, and more!

LimbeckCommented:
hi, please try this:

<script type="text/javascript" language="javascript">
    function checkKeys(event) {
        if (window.event.keyCode == 13){
           event.returnValue=false;
           event.cancel = true;

           document.getElementById('Button1').click(this);
      return false;
        }
    }
</script>

0

Experts Exchange Solution brought to you by

Your issues matter to us.

Facing a tech roadblock? Get the help and guidance you need from experienced professionals who care. Ask your question anytime, anywhere, with no hassle.

Start your 7-day free trial
Munawar HussainPrincipal Software EngineerCommented:
instead of this line
 document.getElementById('Button1').click();

you may use this one to post you page back??

document.form1.submit()

thanks
0
Munawar HussainPrincipal Software EngineerCommented:
instead of this line
 document.getElementById('Button1').click();

you may use this one to post you page back??

document.form1.submit()

thanks
0
rwarcupAuthor Commented:
Thanks Limbeck & NazoUK. Submitting fine now!
0
LimbeckCommented:
glad to be of help :)

Ed.
0
It's more than this solution.Get answers and train to solve all your tech problems - anytime, anywhere.Try it for free Edge Out The Competitionfor your dream job with proven skills and certifications.Get started today Stand Outas the employee with proven skills.Start learning today for free Move Your Career Forwardwith certification training in the latest technologies.Start your trial today
ASP.NET

From novice to tech pro — start learning today.