I have the following code on my page:
$('form.enter-doesnt-submit').submit(function () {
console.log($(document.activeElement));
if($(document.activeElement).attr('type') == 'submit') {
console.log
return true;
} else {
console.log("Prevented enter from submitting the form.");
return false;
}
});
Which I'm fairly certain I got from stackoverflow a long time ago. It works fine, just not in Safari. The reason being that when I log out document.activeElement it gives me the entire page, so of course the attribute type is not submit and therefore the form doesnt submit even when you are clicking the submit button.
I need to be able to prevent enter submitting on my form because they are online tests, and if the user is writing an answer and accidentally presses enter before the form is complete then they are marked incorrectly as they didn't actually finish the test.
Can anyone help me with some way of preventing enter from being pressed on Safari?
Okay I solved this by coming at it in another way, by targeting the inputs in the form instead:
$('form.enter-doesnt-submit input[type=text]').keypress(function (e) {
if(e.keyCode == 13) {
e.preventDefault()
}
});
Pressing enter in a textarea doesnt submit a form by default, so its just the inputs that need preventing. Now my submit button works in safari and in chrome.
Related
I have a html form with no submit button. I want to submit that form upon hitting ENTER button. I used a simple jquery code to submit the form upon hitting ENTER.
$("form :input").keypress(function(e)
{
if(e.keyCode == 13)
{
$(this).parents('form').submit();
}
});
But there is a problem with this code. When i type in text field and want to select a suggestion (these are the suggestions, suggested by browser based on the history for that field) for that field using "ENTER" key it trigger the submit of the current form. I want to skip this as well.
Is there something like in jquery or javascript
$("form :input").keypress(function(e)
{
if(e.keyCode == 13)
{
if(! $(this).is('suggestOpened')) // i want something like this
{
// submit the form
}
}
});
Thanks in advance.
No, there's no such event. You could play with onchange and onblur events to intercept whether the user is filling a particular field, but anyway without a submit button:
There's no way for the user to figure-out how to submit the form
The same action (enter key press) could lead to two different actions, which breaks UI consistency
IMHO you should definitely place a submit button.
having a problem with the number one browser for downloading another browser...IE
IE8 fails to submit when you hit enter in a form. here is what i use:
function submitOnEnter() {
if (browserName=="Microsoft Internet Explorer")
{
var key;
if (window.event){
key = window.event.keyCode; //IE
}
if(key == 13){
document.forms['myform'].submit();
}
}
}
and this is located on the text input :
onkeyup="submitOnEnter()"
The form seems to submit when i press enter twice?? but not once.
Can you help?
Okay guys, i fixed it using....
<!-- Fix for IE bug (One text input and submit, disables submit on pressing "Enter") -->
<div style="display:none">
<input type="text" name="hiddenText"/>
</div>
Weird eh? Maybe this will work for some of you and not others. some solutions didnt work for me, this one did.
Submit works when pressing ENTER when there is a submit button present in the form <input type="submit">. You can hide the button if you want. No need to intercept keystrokes.
My problem was that i checked for the submit button. But IE seems not to send the submits in the $_POST array. Adding a hidden field solved my problem.
I am handling ajax suggestions using keyboard and mouse, it is capturing every keyevent except enter key(13). What I want is to get the "selected suggestion value" into the text box. For this I am handling keyevent = 13. Now the problem is when I am pressing enter key, my form get submitted instead of going into the "if block" where I am checking (keyevent = 13).
I am using struts <html:submit> tag to submit my form. I guess, the browser automatically set the focus into first <html:submit> tag that comes in its place. How to defocus this? I tried setting focus at other fields but trick doesn't work.
The other way is, I can use simple <html:button> and can get the things working, but the system already using <html:submit>. So, getting approval and modification is quite hectic.
Code for submit button:
<html:submit styleClass="btn" property="method.saveVisaRequestForRMG" onclick="bCancel=false" styleId="submitBtn">
and code for event handling:
// Handle ENTER key
case 13: handleSelectedItem(obj, container, cur);
ev.cancelBubble = true;
break;
How to come out of this problem? Please suggest me.
If you use jquery there is a simple way to handle enter press events:
$(window).keypress(function(e) {
if(e.keyCode == 13) {
e.preventDefault();
alert('Enter!');
}
});
After you prevented the default event you can do whatever you want for example posting the data into the server, saying hello or whatever :)
Try to return false; to cancel the event handling of the submit?
Do you have something like:
onsubmit="return formValidator()"
I have a form that I use JQuery, I don't think I need to put code in this post, the question is pretty basic.
But I would like to block the form from submitting when people press the Enter Key or the Return Key.
At the same time, I have textareas, where the user will need to be able to press the Enter / Return keys.
A quick and nasty hack but generally more reliable than trying to block keypresses in every field: add:
<input type="submit" onclick="return false;" />
at the top of the form. The first submit in a form acts as a default button for when Enter is pressed in current browsers, so by neutering it you prevent an Enter-submission from occurring.
Then use CSS to hide and/or move the button so it can't be seen.
It isn't always a good idea to block Enter-submissions though; it's the standard way the browser is expected to work and some users really do want it.
set a flag at the document level, submitform = false;
validate submissions against this.
change the flag in the onclick handler of the submit button.
Couldn't you add an onsubmit attribute to the form, then check if it was submitted using the enter key?
You could try this
jQuery(document).ready(function(){
validSubmit = false;
})
jQuery('myForm textarea').keypress(function(e) {
if (e.which == 13) {
validSubmit = true; // if the pressed key is enter, then allow submissions
}
})
jQuery('myForm').submit(function(){
if (!validSubmit) {
return false; //if submitting the form is not allowed, then cancel submission
}
})
This cancels all submissions whatsoever unless the enter/return key is pressed on a textarea. If you are using a button, you need to add a function to that too.
jQuery('form button.validSubmit').click(function(){ //or 'form input[type="submit"]'
validSubmission = true;
})
I'm using anchors to submit forms:
$("a[title=submit]").click( function(){
$(this).parents("form").submit();
});
It works very well, however I still want the user to be able to submit the form when pressing enter or return.
Anyone know how to do this?
$("form").bind("keypress", function(e){
if(e.keyCode == 13){
$(this).submit();
}
});
You should be able to do that by default. If you have an onsubmit for the form make sure it returns true, otherwise returning false will prevent the form from submitting normally.
Unless your submit function is doing something funky it shouldn't block the user from submitting by pressing enter inside a field.