We Keep Coding

Javascript restrict text field to numbers and decimals?

I've tried a few solutions here but all of them boil down to removing the non-numeric input after the input is put in.
This solution here works for numbers:
https://jsfiddle.net/HkEuf/17470/
But it doesn't allow decimals.
I've to edit it as follows but it still won't allow for decimals:
$(document).ready(function () {
//called when key is pressed in textbox
$("#quantity").keypress(function (e) {
//if the letter is not digit then display error and don't type anything
if (e.which != 110 && e.which != 190 && e.which != 8 && e.which != 0 && (e.which < 48 || e.which > 57 )) {
//display error message
$("#errmsg").html("Digits Only").show().fadeOut("slow");
return false;
}
});
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input type="text" name="quantity" id="quantity" />

You could do this all with HTML, all you need to do is use the number type with a step attribute like this.
Note 1: By adding the required attribute we can validate the field on submit otherwise it won't be validated unless there is input within the field.
Note 2: the number type also supports min and max
Note 3: Supports IE 10+ and all other major browsers
<form>
<input type="number" step="0.001" name="quantity" id="quantity" required>
<p><input type="submit" value="Numbers Only!"></p>
</form>
Prevent "E" key
We can block the e key with a keydown event and if e.key == 'e' we can prevent the key:
Array.from(document.querySelectorAll('[type=number]')).forEach(i => {
i.addEventListener('keydown', function(e) {
if(e.key == 'e') e.preventDefault()
})
})
<form>
<input type="number" step="0.001" name="quantity" id="quantity" required>
<p><input type="submit" value="Numbers Only!"></p>
</form>

Here I've added some code in your jsfiddle reference to allow decimal number and prevent user to enter "." symbol twice. Here's the complete code
$(document).ready(function () {
//called when key is pressed in textbox
$("#quantity").keypress(function (e) {
var tempInput = $("#quantity").val()
if(tempInput.split(".").length >= 2 && e.which == 46)
return false; //To check whether user has entered dot symbol before
//if the letter is not digit then display error and don't type anything
if (e.which != 110 && e.which != 46 && e.which != 190 && e.which != 8 && e.which != 0 && (e.which < 48 || e.which > 57)) {
//display error message
$("#errmsg").html("Digits Only").show().fadeOut("slow");
return false;
}
});
});
If anything goes wrong, feel free to ask.
P.S : I assume that you use "." symbol to represent float number

$(document).ready(function () {
//called when key is pressed in textbox
$("#quantity").keypress(function (e) {
// If it's not a digit then display error and don't type anything
if (e.which == 46 || e.which == 8 || e.which == 0 || (e.which > 48 && e.which < 57 )) {
// Validate count of decimal separators
var dSCount = ($(this).val().match(/\./g) || []).length;
if (e.which == 46 && dSCount > 0) {
// Display error message
$("#errmsg").html("Only one decimal separator allowed").show().fadeOut("slow");
return false;
}
} else {
// Display error message
$("#errmsg").html("Digits Only").show().fadeOut("slow");
return false;
}
});
});
There is a chance that the input ends with a dot, you'll have to validate that too (you could simply remove the trailing decimal separator before the form submission).

How to create a javascript function that responds to a click or enter pressed?

I need the if bottom if statement to run if #nextQ is clicked (like it is currently) or if enter is pressed.
$('input[type=text]').on('keyup', function(e) {
if (e.which == 13) {
alert("enter is pressed");
return true;
}
});
$('#nextQ').click(function() {
//me.html validations
if (actual == 0 && document.URL.indexOf("me.html") >= 0){
loadNew();
}
});

If your input is wrapped in a form and that form has a submit button, it is submitted when you press enter inside the input.
Knowing this you should listen to the submit event:
The form:
<form class="myForm">
<input name="answer" type="text">
<button id="nextQ" type="submit">next Question</button>
</form>
JS:
jQuery( '.myForm' ).on( 'submit', function( event ) {
//me.html validations
if (actual == 0 && document.URL.indexOf("me.html") >= 0){
loadNew();
}
} );

Block enter key when less than 4 digits entered

I'm trying to implement a code in my script that will block enter key until 4 digits entered in a text field.
Here are my forms:
<div id="inputtext">
<input type="text" id="dreamtext" maxlength="45" spellcheck='false' autofocus/>
<input type="submit" id="nextstepbutton" value="next step" onclick="window.open('step3.html','_self','resizable=yes')" />
</div>
This particular script hides submit button when < 4 characters entered and shows it when 4 or more entered. It also modifies some div content.
<script type="text/javascript">
$(function(){
$("#nextstepbutton").hide();
$("#dreamtext").keyup(function() {
var val = $(this).val();
if (val.length > 3) {
$('#nextstepbutton').show();
document.getElementById("message").innerHTML = "<h1>hit return or next step</h1>";
}
else {
$('#nextstepbutton').hide();
document.getElementById("message").innerHTML = "<h1>type please</h1>";
}
});
});
</script>
This script presses submit button when enter key pressed
<script type="text/javascript">
$("#dreamtext").keyup(function(event){
if(event.keyCode == 13){
$("#nextstepbutton").click();
}
});
</script>
Now, what is the best way to block the enter key when less than 4 digits entered? Thanks

There is a method in the keydown(/up/press) event called preventDefault.
This makes any default action not happen.
$("#dreamtext").keyup(function(event) {
if ($(this).val().length < 4) {
event.preventDefault();
}
if (event.keyCode == 13) {
$("#nextstepbutton").click();
}
});
You could also connect it to the jQuery .submit() handler.
$("#someForm").submit(function(){
if ($("#dreamText").val().length < 4) {
return false;
}
})

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.