Why isn't the value being printed? - javascript

Here's the short code:
<!DOCTYPE html>
<script type="text/javascript">
function myKeyPress(e)
{
var keynum;
var list;
if(window.event)
{
keynum = e.keyCode;
list = keynum;
if(list == 115)
{
alert("You pressed the 'S' key.");
}
}
}
</script>
<form>
<input type="text" onkeypress="myKeyPress(event);"/>
</form>
When I hit a key, myKeyPress should be called and the event should be passed to the function. In the function body, e (the event parameter) should fetch the Keynum and obtain the input value. That value should be 115 if I were to press 'S' on the keyboard. List should then have the value of Keynum, and list is checked to see if its value is equal to 115 (it should be). If so, it should alert the corresponding text in a message box on the screen. It doesn't do it though. Why?

Here is a shortened version of your code:
function myKeyPress(e) {
var keynum = e.which ? e.which : e.keyCode;
alert(keynum); // Just to see all key presses, remove when done :)
if (keynum == 115) {
alert("You pressed the 'S' key.");
}
}
I am binding it using JavaScript not using an HTML attribute:
document.getElementById('example').onkeypress = myKeyPress;
So I added an ID:
<input type="text" id="example" />
I find that this works. I'm not sure why you were testing window.event in your code?

s key is nr 83 and not 115.
you could find out like this with jQuery.
<script type="text/javascript">
$('#myinput').on('keyup',function(e){
console.log(e.keyCode);
});
</script>
<input type="text" id="myinput" />

Related

i want alert some thing every time when i pressed enter key

every time time when i pressed the enter key in input field then it should alert some thing but facing problem in doing that here is the code.
<input type="text" class="searchfld" id='input' onchange="gotothatpost(this.value)" onkeyup="ajxsrch(this.value)">
Here is the js code
<script>
function ajxsrch(str)
{
var keycod;
if(window.event)
{
keycod = str.getAscii();
}
if(keycod==13){alert("You pressed Enter");}
}
</script>
I think it is because you aren't passing e to the function and only using window.event which does not work in all browsers. Try this code instead.
<input type="text" class="searchfld" id='input' onchange="gotothatpost(this.value)">
<script>
function ajxsrch(e)
{
e = e||event;
var keycod;
if(e)
{
keycod = e.keyCode||e.which;
}
if(keycod==13){alert("You pressed Enter");}
}
document.getElementById("input").onkeyup=ajxsrch;
</script>
Try this..
<input type="text" class="searchfld" id='input' onchange="gotothatpost(this.value)" onkeyup="ajxsrch(event)">
<script>
function ajxsrch(e)
{
if (e.which === 13) {
alert("You pressed Enter");
}
return false;
}
</script>
Pass the event object to the function call
<input type="text" class="searchfld" id='input' onkeyup="ajxsrch(event)">
Use the event object in the JS and get the key value.
function ajxsrch(ev) {
var ch = ev.keyCode || ev.which || ev.charCode; // Proper way of getting the key value
if(ch == 13) {
alert("You pressed enter");
}
}

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()
}
}

How can i change the textbox value on pressing space?

I want to change the English words into Hindi
every time I press space in textbox its a keypress event but how to apply only for space key.
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>
<script>
$(document).ready(function(){
$('#textboxid').keypress(function(e){
var code = (e.keyCode ? e.keyCode : e.which);
if(code == 32) { //space keycode
//Do language transilation here
}
});
});
</script>
<form id="form1" name="form1">
<input type="text" name="textfield" id="textboxid" />
</form>
Space is 32. So using jQuery keypress event you can do it with:
$("textarea").on("keypress", function(e) {
if (e.keyCode == 32) {
// ...
}
});
For a vanilla js answer:
document.getElementById( 'textboxid' ).onkeypress = function( e ) {
if ( e.keyCode === 32 ) {
// Translate into Hindi
}
}

input box taking numeric value in firefox

Using this code, user won't enter numeric value. In Google Chrome, input box is not taking numeric value but in Firefox it takes. I'm not getting, why it is happening. Any help appreciated.
<input type="text" name="station_name" id="station_name" onKeyPress="return noNumbers(this)" maxlength="45" />
this is my javascript function
<script type="text/javascript" language="javascript">
function noNumbers(evt)
{
var charCode = (evt.which) ? evt.which : event.keyCode;
if((charCode>=65 && charCode<=90)||(charCode>=97 && charCode<=122)||(charCode==32))
return true;
return false;
}
</script>
This is because, in Firefox, the event is passed as a parameter to the event handler. event property of the window object is IE only.
function enterHere(e)
{
e = e || window.event;
var code = e.keyCode || e.which;
if(code == 13)
find();
}
you are passing this in the following line, pass event
<input type="text" name="station_name" id="station_name" onKeyPress="return noNumbers(event)" maxlength="45" />
EDIT
ok try the follwoing function and the input tag as above:
function noNumbers(evt)
{
var charCode = evt.keyCode || evt.which;
if((charCode>=65 && charCode<=90)||(charCode>=97 && charCode<=122)||(charCode==32)||||(charCode==8))
return true;
return false;
}

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.

Categories