Click to behave like a Return - javascript

I'm building a form and i'd like to make my radio button behave like i've pressed Enter
something like onclick="keycode=13"
any idea how to do ?

If you wanna submit the form, you can just attach the click handler to submit the form.
<input type="radio" onclick="this.form.submit();" />
Or you an even trigger the enter key!
<input type="radio" onclick='e = jQuery.Event("keypress"); e.which = 13; e.keyCode = 13; this.trigger(e);' />

In your event handler you can submit a form using the following code:
document.getElementById("myForm").submit();

Add onkeypress on your form:
<form .. onkeypress="return myEvent(event)">
<input type="radio" id="myRadio">
Than add Javascript
<script type="text/javascript">
function myEvent(e) {
e = e || window.event;
var key = e.keyCode || e.charCode;
if (key === 13) {
// enter down
document.getElementById('myRadio').checked = true;
return false; // prevent form post on enter
}
return true;
}
</script>
I think the code above should work, because I have very similar code to prevent form post on Enter press.

Bit late, however...
<form name="myform">
<input type=radio onclick="this.parentNode.submit()">click</input>
</form>

i managed to achieve this by adding the followind code to the script
document.addEventListener( 'click', function( ev ) {
ev.preventDefault();
self._nextQuestion();
} );

Related

Submit a PHP Form with any of keyboard shortcut key

i wants to submit a php form with any of function key or a Any of keyboard shortcut key.
I try following code. In that i do operation using keyboard keycode. but its not submits the form.
Press "TAB" button from Keyboard
document.onkeydown=function(evt){
var keyCode = evt ? (evt.which ? evt.which : evt.keyCode) : event.keyCode;
if(keyCode == 9)
{
//your function call here
document.test.submit();
alert("Key Pressed");
}
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<?php
if(isset($_POST['search']))
{
echo $search = $_POST['search'];
}
?>
<body>
<form name="test" action="#" method="POST">
<input type="text" name="search" />
</form>
</body>
I wants to submit a PHP form with any of Function key or Any of combinations or shortcut key.
So How can I do it with JQUERY,JS,AJAX OR PHP.
I founded a JS to Allow Form Submit using keyboard key combination.
It quite easy.
See Code
shortcut.add("Ctrl+B",function() {
document.getElementById("sbmt").click();
alert("Form Submitted...");
},{
'type':'keydown',
'propagate':true,
'target':document
});
When Press Ctrl + B Form Was Submits.
This is Link to JS
openjs To Allow Shortucut
Checkout this if you want to submit on click of any function keys
JsFiddle
$(document).keyup(function(e) {
if(e.which <124 && e.which >111){
alert('function keys');
//submit your form here
}
});
try this it will work.
document.onkeydown=function(evt){
var keyCode = evt ? (evt.which ? evt.which : evt.keyCode) : event.keyCode;
if(keyCode == 9)
{
//your function call here
document.forms["test"].submit();
alert("Key Pressed");
}
}
Check this code in your local not on third party. This will work perfect on localhost. this is work for me.

How to submit form with enter key when I have a button, not a submit

I have a form with a button submit type, and I would like it to submit when enter key is pressed. I don't know how to implement this with the JS function I call when submitting the form.
FORM:
<form name="form1">
<textarea name="msg" id="message">
</textarea>
<p id="button">
<input type="button" value="Enter" onclick="submitChat()" id="innerbutton"></p>
JS Function
function submitChat() {
var uname = document.getElementById('nameplace').innerHTML
var msg = form1.msg.value;
var xmlhttp = new XMLHttpRequest();
var badname = uname.charAt(0);
if (msg != "" & badname != "<") {
xmlhttp.onreadystatechange = function() {
if (xmlhttp.readyState==4&&xmlhttp.status==200) {
document.getElementById('chatlogs').innerHTML = xmlhttp.responseText;
}
}
xmlhttp.open('GET','insert.php?uname='+uname+'&msg='+msg,true);
xmlhttp.send();
}
Attach keydown event with the document and call your function if Enter is pressed
$(document).on("keydown",function(e){
var keyCode = e.which || e.keyCode;
if(keyCode == 13) // enter key code
{
submitChat();
}
});
Use a real submit button and move your JavaScript from its click event to the form's submit event. Prevent the default behaviour of the form submission so that normal submission don't happen.
<form id="form1">
<textarea name="msg" id="message">
</textarea>
<p id="button">
<input type="submit" value="Enter">
</p>
and
document.getElementById("form1").addEventListener("submit", submitChat);
function submitChat(event) {
event.preventDefault();
// etc
This should work:
document.getElementById('innerbutton').onkeydown = function(e){
if(e.keyCode == 13){
// your submit function call here
}
};
keyCode 13 is Enter key.

Press enter to submit form if checkbox is checked

I have a form that submits with a button, but I want to also allow to submit by typing the ENTER key if a checkmark has been checked.
I've got the enter part working:
<form action="index.php">
<textarea onkeydown="pressed(event)"></textarea>
</form>
<input type="checkbox" id="enterCheckbox" />
<script>
function pressed(e) {
if ( (window.event ? event.keyCode : e.which) == 13) { document.forms[0].submit() }
}
</script>
Now I want to only run that function if #enterCheckbox has been checked, but I'm having trouble doing it correctly. Any help?
Does what you have work as expected other than just adding the extra condition? If so, you should be able to just add in the extra check with && in your current if(...) check.
Something along the lines of $('#enterCheckbox').attr('checked') should tell you if the checkbox is checked or not.
You should be able to do something like this:
if(document.getElementById(enterCheckbox).checked)) {
// do all the good stuff
}
Your function should include an extra condition.. something like:
<script>
function pressed(e) {
if ( ( (window.event ? event.keyCode : e.which) == 13) AND (document.getElementById('enterCheckbox').checked) ){ document.forms[0].submit() }
}
</script>
If using jQuery, I suggest using selectors to make life easier. But what you want for checking if #enterCheckbox is checked is .is(':checked').
Updated HTML
<form id="myForm" action="index.php">
<textarea id="myTextarea"></textarea>
</form>
<input type="checkbox" id="enterCheckbox" />
jQuery Implementation
$('#myTextarea').on('keydown', function(e) {
var key = window.event.keyCode || e.which;
if($('#enterCheckbox').is(':checked') && key == 13) {
$('#myForm').submit();
}
});
To check if the box is checked, using jQuery:
$("#enterCheckbox").is(":checked")
So your <script> will be:
function pressed(e) {
if (($("#enterCheckbox").is(":checked")) && ((window.event ? event.keyCode : e.which) == 13)) {
document.forms[0].submit()
}
}

Execute function by pressing "return" using jQuery?

i have two text inputs like the following, i don't want to use <form> , so i want when people press "return" BUTTON after filling the inputs, a function called "doit()" should be executed.
<script>
function doit(){
alert("you submitted the info");
..........ajax code........
}
</script>
<input type="text" id="email" />
<input type="text" id="skills" />
Thanks
The following will do what you are looking for.
$('#emails, #skills').keypress(function(e){
if( e.keyCode == $.keyCode.ENTER || e.keyCode == $.keyCode.NUMPAD_ENTER ){
yourSubroutine();
}
});
$('#name, #last').bind('keydown', function(e) {
if (e.keyCode == 13 || e.keyCode == 108) {
doit();
}
});
KeyCode can be found here
Check out this question. Essentially, you'll want to bind a keypress listener, and then check for the return key.

Javascript: Enter for submit

Hello this is what i have in the head of my file:
function entsub(event)
{
if (event && event.which == 13)
write1();
else
return true;
}
and in the body, my form is:
<form id="writeform" name="writeform">
Message: <br />
<textarea name="message" rows="3" id="message" style="width:90%;" onkeypress="return entsub(event)"></textarea>
<br />
<input name="send" type="button" id="send" value="Send" onclick="write1()" />
<span id="sent"></span>
<input type="reset" value="Reset" />
</form>
I need to make it work that when i press enter when i am in the textarea, it does not make a new line but send it [see my <input type="button">]
But it won't work! It keeps making a new line... Using IE8 now.
Well i'm not sure what write1() does, but it would be prudent to return false when the condition is met..
function entsub(event)
{
if (event && event.keyCode == 13) {
write1();
return false; //Return false to prevent default execution
//Some browsers use event.preventDefault() etc.
}else{
return true;
}
}
Usually the cross browser test is the following:
function entsub(e) {
if ((e.which && e.which == 13) || (e.keyCode && e.keyCode == 13)) {
write1();
}
return true;
}
If you want to use jquery, you can do this:
$(document).ready(function() {
$("#txtTest").keypress(function(e) {
var code = (e.keyCode ? e.keyCode : e.which);
if (code == 13) {
doSomething();
return false;
}
});
});
function doSomething() {
alert("I did it!");
}
where txtTest is the id of your textarea.
Use keyCode instead of which.
Depending on the browser, you need to prevent the default action. Check out event.cancelBubble and event.returnValue for IE and event.stopPropagation() and event.preventDefault() for Firefox.
For a non-js related way, I'm pretty sure you can just use an input of type="submit" and it will use enter to submit the form. At that point, you would just move your event to onsubmit.
A cleaner way is to change to <input type="button"> to <input type="submit"> and move the onclick="..." to a onsubmit="..." on the form. This would not require so much error-prone JavaScript and would work in more cases.

Categories