Solved

jquery keypress function is also activating form submission

Posted on 2014-03-05
2
340 Views
Last Modified: 2014-03-05
I have the following jquery keypress function:
$(document).ready(function(){
	$("#tocall").keypress(function(e) {  
		if (e.which == 13) {
			params = { "tocall" : $('#tocall').val()};
			connection = Twilio.Device.connect(params);
	}
	...

Open in new window

This code also activates the following code submission tag:
<INPUT type='submit' value='DELETE'>

Open in new window

Why is it doing this and how do I stop it?

Attached is the entire php script in case you need to see it.
recordings-no-sid.php
0
Comment
Question by:thenelson
2 Comments
 
LVL 9

Accepted Solution

by:
WebDevEM earned 500 total points
ID: 39907655
Hi,

I'm running out the door so I don't have time to test, but try adding e.preventDefault(); like so:
$(document).ready(function(){
	$("#tocall").keypress(function(e) {  
		if (e.which == 13) {
                        e.preventDefault();
			params = { "tocall" : $('#tocall').val()};
			connection = Twilio.Device.connect(params);
	}
	...

Open in new window

The jQuery isn't actually triggering the form submission, that's caused by the ENTER key itself.  What the preventDefault() does is tell the browser to ignore the normal action caused by pressing ENTER.

Hope this helps... I'll be back online in the morning.

WebDevEM

Reference: http://api.jquery.com/event.preventdefault/
0
 
LVL 39

Author Closing Comment

by:thenelson
ID: 39907818
That took care of it! And thanks for the explanation.
0

Featured Post

What Security Threats Are You Missing?

Enhance your security with threat intelligence from the web. Get trending threat insights on hackers, exploits, and suspicious IP addresses delivered to your inbox with our free Cyber Daily.

Join & Write a Comment

Suggested Solutions

What is Node.js? Node.js is a server side scripting language much like PHP or ASP but is used to implement the complete package of HTTP webserver and application framework. The difference is that Node.js’s execution engine is asynchronous and event…
Styling your websites can become very complex. Here I'll show how SASS can help you better organize, maintain and reuse your CSS code.
The viewer will learn how to count occurrences of each item in an array.
The viewer will learn the basics of jQuery, including how to invoke it on a web page. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery.: (CODE)

708 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question

Need Help in Real-Time?

Connect with top rated Experts

12 Experts available now in Live!

Get 1:1 Help Now