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
}
}
Related
This is meant to allow a user to type in a message and then press enter to send it. This should clear the box so that the user can type in a new message. The problem is that the standard result of pressing enter (creation of a newline) is occurring after the .empty() event....so the text vanishes and is replaced by a newline, which is quite undesirable. How can I circumvent this?
$('#messagebox').keypress(function(event) {
if (event.keyCode == '13') {
send();
$('#messagebox').empty();
}
});
You can prevent the default action of the keypress via event.preventDefault() (or return false from your event handler function, which is jQuery shorthand for preventDefault + stopPropagation):
Live example | source:
HTML:
<p>Pressing Enter will clear the text area below:</p>
<textarea id="messagebox" rows="10" cols="50"></textarea>
JavaScript:
jQuery(function($) {
$("#messagebox").focus().keypress(function(event) {
if (event.keyCode === 13) {
$(this).val("");
event.preventDefault();
}
});
});
FWIW, I'd probably use val with an empty string rather than empty to clear the textarea, since val is specifically for setting the value of form fields — but if empty() is working for you...
$('#messagebox').keypress(function(event) {
if (event.keyCode == '13') {
event.preventDefault();
send();
$(this).empty();
}
});
demo
$('#messagebox').on('keydown',function(e) {
if (e.which === 13) {
send();
$(this).val('');
e.preventDefault();
}
});
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
}
}
I want call function when the user presses enter on the input.
<input type='text' id='name'></input>
I found this code but it doesn't work.
$("#name").bind('keypress', function(e) {
if(e.which == 13) {
alert('You pressed enter!');
}
});
Did you include the JQuery library? Your code appears to work fine in Chrome.
You could also do:
$("#name").keypress(function(e) {
if(e.keyCode == 13) {
alert('You pressed enter!');
}
});
JSFiddle: http://jsfiddle.net/dMt55/
Non Jquery version:
document.getElementById('name').onkeypress = function(e) {
if(e.keyCode == 13) {
alert('You pressed enter!');
}
}
Please try this;
<input type='text' id='name' />
$("#name").bind('keypress', function(event) {
if (event.keyCode== 13) { //Enter
// your code
}
});
You can wire up your own custom event
.Try this
HTML
<input type='text' id='name'></input>
Jquery
$('#name').bind("enterKey",function(e){
//do stuff here
});
$('#name').keyup(function(e){
if(e.keyCode == 13)
{
$(this).trigger("enterKey");
}
});
http://jsfiddle.net/x7HVQ/
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
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