Disable enter submit - javascript

I have a form with a textfield inside and I am trying to disable the default behavior when the browser submits the whole form if the user presses Enter while the textfield is selected.
$('#recaptcha_response_field').keydown(function(event) { if (event.keyCode == 13) {
event.preventDefault();
event.stopPropagation();
event.stopImmediatePropagation();
alert("You Press ENTER key");
return false;
}
});
Currently am getting "You Press ENTER key" and the default behavior isn't overridden.

Try this:
$(document).on("keypress", 'form', function (e) {
var code = e.keyCode || e.which;
if (code == 13) {
e.preventDefault();
return false;
}
});
This will prevent the form submit on keypress
DEMO HERE

I found this and it works for me.
<input type="text" name="somename" id="someid" value="" onkeypress="return event.keyCode!=13">

To prevent the script from blocking the enter key on other elements such as on a textarea. Change the target from "form" to "input".
$(document).on("keypress", "input", function (e) {
var code = e.keyCode || e.which;
if (code == 13) {
e.preventDefault();
return false;
}
});

If none of the above solution is working for you , and you are using javascript anyway , why don't you use button type as 'button' <input type='button'> and submit it using javascript
$('#form_id').submit();

U can use this script to prevent enter on entire from.
<script type="text/javascript">
$(document).on("keypress", 'form', function (e) {
if (e.target.className.indexOf("allowEnter") == -1) {
var code = e.keyCode || e.which;
if (code == 13) {
e.preventDefault();
return false;
}
}
});
</script>
you put the classname to which control need to use enter

Related

how to submit the form using ENTER key

I am trying to design a cluster layout with input field and submit button..everything works fine when i type the text and click enter button..but i want to use the ENTER key for this purpose...
i mean ONE ACTION IN TWO BUTTON(ENTER key and SUBMIT button)
below is what i have tried
$(document).ready(function(){
$('editor').bind('keydown',function(event){
var keyCode= (event.keyCode ? event.keyCode :
(event.which ? event.which : event.charCode));
if(keyCode==13){
document.getElementById('update').click();
return false;
}else{
return true;
}
});
});
for the above code,no action on keypress and no error in the console
this is my entire code - https://pastebin.com/NbwEJQGX
Can anyone suggest me some way to solve this issue???
$("input").keyup(function(e){
if(e.which == 13){
$("#form").submit();
}
});
$("input").keypress(function(event) {
if (event.which == 13) {
//do stuff
}
});
See this code for button clicks
$( "button" ).click(function() {
//do stuff for button click
});
I would suggest to add a class respective input field. then capture the event by the class as you may have multiple field where you want to submit the form after giving some value.
<input type="text" class="entr"/>
<input type="text" class="entr"/>
$('.entr').keypress(function(e){
if (e.keyCode == 13) {
$('#editorForm').submit();
}
});
This should work
$(document).ready(function(){
$(document).keypress(function(e) {
if(e.which == 13) {
$( /* Your form here */).submit();
return false;
}
});
$(/* Where to click */).click(function(){
$( /* Your form here */).submit();
return false;
});
});
You can also call the function in the input
<input id="example" type="text" onkeypress="functionName(event, 0)" />
<input id="example" type="button" onclick="functionName(event, 1)" />
function functionName(e, n) {
if (e.keyCode == 13 || n == 1) {
//do stuff
}
}

in textbox how when when I press ENTER submit the Form and when I press shift+ENTER insert new line

how in textbox when when I press Enter submit the Form and when I press Shift+Enter insert new line like facebook comments and posts
might have a solution for your submit on Enter
Assuming you're using jquery :
$('your-input-selector').keypress(function(event) {
if (event.keyCode == 13) {
$('form').submit();
}
});
Javascript :
The HTML input
<input type="text" onkeypress="myKeyPressHandler(event)">
Javascript function
function myKeyPressHandler(event) {
if (event.keyCode == 13) {
document.getElementById("myForm").submit();
}
}
Edit 1
Here your solution for the Shift+Enter combination:
Jquery:
$('your-selector').keyup(function (e) {
if (e.which === 13 && e.shiftKey) {
alert('shift enter pressed');
//Do your work here
}
});
Non-Jquery :
<input type="text" onkeyup="myKeyUpHandler(event)">
Javascript function:
function myKeyUpHandler(e) {
if (e.which === 13 && e.shiftKey) {
alert('shift enter pressed');
//Do your work here
}
}

If key pressed after an input clicked

I want to know if the user clicked the input and after that pressed the enter key:
$('#AdsData tr td input').live('keypress', function (e) {
// if the Enter key is presses
if (e.which == 13) {
}
});
I tried it: clicked an input and pressed enter but the function wasn't called..
may be you can try doing with e.which and e.keyCode both this way:
var kc = e.which || e.keyCode;
if (kc == 13) {
and instead of keypress try with keyup or keydown
Try this
$('input').keydown(function(event) {
if(event.which == 13) {
alert('Enter.');
}
});
if the input element is part of a form, pressing enter will most likely submit the form. in that case try this:
$("#your_form").on("submit", function() {});

VB.NET: How to execute jquery code when pressing enter in textbox

I have an issue where I'm trying to execute a search query from a textbox and attempting to use enter to initiate the search; however, it doesn't seem to be working. I'm wondering if vb.net/asp.net is doing a postback or something that I'm not aware of.
ASPX Page
<form class="navbar-search">
<input id="searchbox" type="text" class="search-query span3" placeholder="Search" />
<div class="icon-search"></div>
</form>
JQuery
$('#searchbox').keyup(function (e) {
//alert("this will execute");
if (e.which == 13) {
alert("this will not execute");
//window.location.href = "http://www.google.com/";
}
});
I can't get the alert box to execute or the change location to work... if anyone can help I appreciate it.
Try this:
$("#searchbox").keypress(function (e) {
//alert("this will execute");
var code = e.keyCode || e.which;
if (code == 13) {
alert("this will not execute");
//window.location.href = "http://www.google.com/";
}
});
and to stop page from refreshing on-enter use this:
$(document).keydown(function (e) {
var code = e.keyCode || e.which;
if (code === 13) {
e.preventDefault();
}
});
FIDDLE
Please try this.
$("#searchbox").live("keyup", function(event) {
if (event.keyCode == 13) {
//window.location.href = "http://www.google.com/";
}
});
This was worked for me...

Stopping enter key submitting also stops enter key in multi line text edit

There are lots of solutions on the web for stopping the enter key from submitting a form. Most commonly to use <body onkeypress = ...
But these seem to have the undesired side effect of stopping the enter key working in a multi-line text box. Does anyone know of a way around this, so the enter key will still work in a multi-line text box?
Thanks,
AJ
<script language="Javascript">
document.onkeydown = function() {
if (event.keyCode == 13) {
if (document.activeElement.tagName.toLowerCase () != "textarea") {
event.preventDefault();
return false;
}
}
}
</script>
Something like this?
You can try the following (with jquery):
$(function(){
$('input:not(textarea)').live('keypress', function(e) {
if (e.which == 13) return false;
if (e.which == 13) e.preventDefault();
});
});
Only input fields are targeted, not textareas.
NON JQUERY
function disableEnterKey(e)
{
var key;
if(window.event)
key = window.event.keyCode;
else
key = e.which;
return (key != 13);
}
And add onKeyPress on all text inputs
<input type="text" name="textIn" onKeyPress="return disableEnterKey(event)"/>
Ref : http://www.bloggingdeveloper.com/post/Disable-Form-Submit-on-Enter-Key-Press.aspx

Categories