This question already has answers here:
jQuery: what is the best way to restrict "number"-only input for textboxes? (allow decimal points)
(40 answers)
Closed 9 years ago.
Need to restrict entering alphabets and special characters in a textbox using jquery. Need to enter only numbers.
How to implement using keypress() functionality in jquery for a text box in jsf?.
Code :
<table>
<tr>
<h:inputlabel value="Actual"></h:inputlabel>
<td>
<h:inputtext id="Actual" styleClass="input-tex" value="#bean.customer"></h:inputtext>
<td>
</tr>
<table>
Any help is appreciated.
you can try this in onkeypress function
function validateDigits(){
var str = "54665";
var re = /^\d+$/;
alert(str.match(re)!=null);
}
it returns true in case it validate successfully otherwise returns false
I'm sure there's a more elegant way, but I use:
$('#parentobject').on('keypress', '#inputid', function (e) {
if (isNaN(e.currentTarget.value) == true) {
var textlen = $(this).val().length;
$(this).val($(this).val().substring(0, (textlen - 1)));
return false;
}
});
Related
This question already has answers here:
How to use toLocaleString() and tofixed(2) in JavaScript
(3 answers)
Closed 2 years ago.
I have an input where the user can enter a number. However the number displayed should be set to 2 decimal places while considering the culture.
For example, if the user enter the number 85,
"85,00"
should be displayed if the culture is french and
"85.00"
should be displayed if the culture is English.
I have the below code for it:
$(document).on("change", ".changeVal", function (e) {
var valueEntered = parseFloat($(this).val());
valueEntered = valueEntered.toFixed(2);
valueEntered = (valueEntered).toLocaleString("fr-FR")
$(this).val(valueEntered);
});
However, this is not setting the input to "85,00".
But when I do,
console.log((80.22).toLocaleString("fr-FR"));
the displayed value is "80,22";
Any idea of what I might be missing here?
HTML:
<input class="mdl-textfield__input text-right placeholder validate-number changeValue" maxlength="150" type="text">
Just use parseFloat after toFixed because it convert the number to a string.
`$(document).on("change", ".changeVal", function (e) {
var valueEntered = $(this).val();
valueEntered = parseFloat(valueEntered.toFixed(2));
valueEntered = (valueEntered).toLocaleString("fr-FR")
$(this).val(valueEntered);
});`
This question already has answers here:
Match exact string
(3 answers)
Closed 4 years ago.
I want the user to only be able to enter English characters, the code below works but on a mac if you hold the letter "a" for example you can insert accented characters such as "รก". I've tried a few different approaches with keydown, keyup etc but even on the release of the key it thinks the value that was entered is "A" so it gets past the regex. Anyone know whats going wrong or a better way on how to do this please?
$('.monogram-letters').on("keypress", function(e) {
var englishAlphabet = /[A-Za-z]/g;
var key = String.fromCharCode(e.which);
if (englishAlphabet.test(key)) {
console.log('true');
return true;
} else {
console.log('false');
}
return false;
});
$('.monogram-letters').on("paste", function(e) {
e.preventDefault();
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<input type="text" value="" class="monogram-letters valid" maxlength="3" id="options-41-container" name="options[41]" data-category="41" data-val="type your letters (up to 3)" required="" aria-required="true" aria-invalid="false">
You can instruct an input text to accept only english characters doing so:
<input pattern="[a-z]" />
You will want to validate server-side as well obviously.
The solution I ended up going for was to check the final string and then just emptying the input if it had an accented character
var $monogramInput = $('.monogram-letters');
var englishAlphabet = /^[a-z]+$/i;
$monogramInput.on("keypress", function(e) {
var key = String.fromCharCode(e.which);
if(englishAlphabet.test(key)) {
return true;
}
return false;
}).blur(function() {
var enteredValue = $(this).val();
if(!enteredValue.match(englishAlphabet)) {
$(this).val('');
}
});
I've been trying for a bit to find a good way to go about this. Here's the trick this is being developed for IE6, so HTML5 is not supported (which is what is making this a pain, and why the button is actually a span). I need to allow all input into the input element but on submit i need to verify that the input is an integer and if it contains alpha characters or decimals throw an error.
<table id="studentIdInputTable">
<tr><td colspan="3"><hr class="style-hr" /></td></tr>
<tr><td><span class="underline bold">Selection 1</span></td>
<td class="center"><span class="small-text">Employee ID</span></td>
</tr>
<tr><td>Please enter your Student ID to <span class="bold italic">start your registration process</span></td>
<td class="center"><input type="text" maxlength="11" id="tbNewStudentId" /></td>
<td> <span id="btnNewStudent" class="validation-button">Start</span></td></tr>
</table>
I have javascript native to the HTML page as below
function CheckNewStudentId(){
var newStudentID = $("tbNewStudentId").val();
newEmployeeID = parseInt(newEmployeeID, 10);
var isNum = /^\d+$/.test(IDnumber);
if (isNum == false) {
alert(IDnumber + " is not a valid student number. Please enter only numbers 0-9, containing no alphabetical characters.");
}
}
It would be easier if this was for a more updated browser platform. Any ideas how I can go about this?
Edit***
For reference to other users this was solved using this function
function validIdCheck(Input){
if(Number.isInteger(Input)==false){
alert("This is not a valid ID");
}
}
connected to this jQuery click function
$("#btnNewStudent").click(function(){
var newStuId = $("#tbNewStudentId").val();
newStuId=parseInt(newStuId);
validIdCheck(newStuId);
});
To check if a number is an integer try this. It returns a boolean.
Number.isInteger(yourNumber)
docs: https://developer.mozilla.org/en-US/docs/Web/API/XMLHttpRequest/Synchronous_and_Asynchronous_Requests
Using part of your code:
function validateStudentId(id) { return /^\d+$/.test(id) }
This will return true if it is a number or combination of numbers from 0 to 9.
If the id can not start with a 0, try this:
function validateStudentId(id) { return /^([1-9]|[1-9]\d+)$/ }
Quick explanation:
^ starts with
[1-9] digit between 1 and 9
| or
\d digit (0 to 9)
+ occurs at least once and up to unlimited times
$ ends with
Test it here
This question already has answers here:
checking whether textfield contains letters in javascript
(2 answers)
Closed 7 years ago.
I'm very new to JavaScript, and I am a little confused. How do I check if my input field:
<form name='formular' method='post' onsubmit='return atcheck()'>
E-mail <input type='text' name='email' id='em'>
<input type='submit' value='Submit'>
</form>
contains the symbol "#"? I'm not looking for a full good e-mail validation, I just wanna check if the field contains that symbol in particular when submitted (in the atcheck() function).
<script language="Javascript">
function atcheck(){
if(document.getElementById('em').value.indexOf('#') === -1) {
// No # in string
return false;
} else {
// # in string
return true;
}
}
</script>
Here's one way to accomplish that:
function atcheck() {
var has_at_char = document.getElementById("em").value.indexOf("#") > -1;
if (has_at_char) {
return false;
}
// your previously exisiting implementation of atcheck() could follow here
}
use indexOf() function
indexOf() documentation
to get the text on your function, you need to use document.getElementById("em").value
This question already has answers here:
HTML text input allow only numeric input
(78 answers)
Closed 8 years ago.
How can I make to accept only numbers inputs in my code: -->> Here ?
Thank you !
You can do this:
<input type="number">
or this:
<input type="text" pattern="[0-9]+">
These will only work in HTML5 compatible browsers.
In javascript you can do this:
JSFiddle
HTML:
<input type="text" id="test" name="test"/>
CSS:
var input = document.getElementById("test");
input.oninput = function(e){
if (/\D/g.test(this.value))
{
// Filter non-digits from input value.
this.value = this.value.replace(/\D/g, '');
}
}