jQuery only allow numbers,letters and hyphens - javascript

How can I remove everything but numbers,letters and hyphens from a string with jQuery?
I found this code which allows only alphanumerical characters only but I'm not sure how I would go about adding a hyphen.
$('#text').keypress(function (e) {
var regex = new RegExp("^[a-zA-Z0-9]+$");
var str = String.fromCharCode(!e.charCode ? e.which : e.charCode);
if (regex.test(str)) {
return true;
}
e.preventDefault();
return false;
});

You just have to change the regexp to this : "^[a-zA-Z0-9\-]+$".
Note that the hyphen is escaped using \, otherwise it is used to specify a range like a-z (characters from a to z).
This code will only check if the last typed character is in the allowed list, you might also want to check if after a paste in your field, the value is still correct :
// The function you currently have
$('#text').keypress(function (e) {
var allowedChars = new RegExp("^[a-zA-Z0-9\-]+$");
var str = String.fromCharCode(!e.charCode ? e.which : e.charCode);
if (allowedChars.test(str)) {
return true;
}
e.preventDefault();
return false;
}).keyup(function() {
// the addition, which whill check the value after a keyup (triggered by Ctrl+V)
// We take the same regex as for allowedChars, but we add ^ after the first bracket : it means "all character BUT these"
var forbiddenChars = new RegExp("[^a-zA-Z0-9\-]", 'g');
if (forbiddenChars.test($(this).val())) {
$(this).val($(this).val().replace(forbiddenChars, ''));
}
});

Since there is so much attention on including a hyphen within a character class amongst these answers and since I couldn't find this information readily by Googling, I thought I'd add that the hyphen doesn't need to be escaped if it's the first character in the class specification. As a result, the following character class will work as well to specify the hyphen in addition to the other characters:
[-a-zA-Z0-9]

I think you can just put a hyphen inside the square brackets.
"^[a-z A-Z 0-9 -]+$"

Related

hyphens in Regular Expressions/ javascript camelCase function

The Function should take a string as an argument and camel case it. I am having trouble with hyphens while using regex and string.replace() method.
camelCase('state-of-the-art') should return 'state-of-the-art'
camelCase("Don't worry kyoko") should return "dontWorryKyoko"
The following works for both cases, but I want to make it DRY, take out the hyphens if clause and include the hyphen case in .replace() and it's call-back.
function camelCase(phrase) {
let re = /[a-z]+/i;
let hyphens = /[-+]/g
if(typeof phrase !== 'string' || !phrase.match(re) || !phrase || phrase === null){
return "Please enter a valid string.";
} else if (phrase.match(hyphens)){
return phrase.toLocaleLowerCase();
}else{
return phrase.replace(/(?:^\w+|[A-Z]|\s+\w)/g, function(letter, index) {
return index == 0 ? letter.toLowerCase() : letter.toUpperCase();
}).replace(/\W+/g, '');
}
}
console.log(camelCase('state-of-the-art')) // 'state-of-the-art'
console.log(camelCase("Don't look back")) // dontLookBack
Can we make the hyphen case work without the hyphens if clause?
Also I feel like camelCase("don't lOOk_BaCK") should lowercase letters with index > 0 but it doesn't seem to be doing that in the console.
Anyone wanna help with this? Thanx
To cope with the hyphen issue you may consider - a part of alphanumeric class by using [\w-] or [^\w-] where appropriate.
To lowercase all non-first letters I suggest to match all words with (\S)(\S*) uppercasing $1 (where appropriate) and lowercasing $2:
function camelCase(phrase) {
return phrase.replace(/[^\w-]*(\S)(\S+)/g, function(_, first, rest, index) {
return (index ? first.toUpperCase() : first.toLowerCase())
+ rest.toLowerCase();
}).replace(/[^\w-]+/g, "");
}
console.log(camelCase("state-of-the-art"));
console.log(camelCase("-state-of-the-art"));
console.log(camelCase("Don't look back"));
console.log(camelCase("don't lOOk_BaCK"));
console.log(camelCase("???don't lOOk_BaCK"));
You can make the hyphens work by adding a negative lookahead assertion .replace(/(?!-)\W+/g, '');. This would tell it to replace all non-word characters, except a - dash character.
Regarding your lower-casing problem: your only criteria right now to decide the case is if it appears at the beginning of the string. Otherwise you're UPPER casing everything (including the upper case matches). This is also a pretty easy fix. Here's the whole thing:
function camelCase(phrase) {
let re = /[a-z]+/i;
if (typeof phrase !== 'string' || !phrase.match(re) || !phrase || phrase === null) {
return "Please enter a valid string.";
} else {
return phrase.replace(/(?:^\w+|(\s+)\w)|[A-Z]/g, function (letter, sp, index) {
console.log(letter, sp, index);
return (index == 0 || sp === undefined) ? letter.toLowerCase() : letter.toUpperCase();
}).replace(/(?!-)\W+/g, '');
}
}
Explanation of the changes:
change order of asssertions in phrase.replace regexp. We want a space-word combo to take precedence over a capitalized match.
add a capturing group to the space, so that we can know better if the capture follows a space
change the boolean expression: we want it to be lower case if:
it's the first character (index===0)
OR there isn't a space match (this would be an [A-Z] match, without a preceding space)
Also just as an aside, you don't appear to be camel-casing on a _ underscore character, only on spaces. Is this intentional? I've never seen a camel-case routine that didn't convert snake-case (underscore).

How to regex match entire string instead of a single character

I am trying to implement "alpha" validation on Arabic alphabet characters input, using the JavaScript regex /[\u0600-\u06FF]/ as instructed in this post. I want to accept only Arabic alphabet characters and spaces.
Now the problem is it gives the following result:
r = /[\u0600-\u06FF]/
r.test("abcd") // false - correct
r.test("##$%^") // false - correct
r.test("س") // true - correct
r.test("abcd$$#5س") // true - should be false
r.test("abcdس") // true - should be false
If a single matching character is given, then it is classifying the whole input as acceptable, even if the rest of the input is full of unacceptable chars. What regex should I be using instead?
You need to add ^ and $ anchors to the regular expression, as well as a + to allow multiple characters.
Try this:
/^[\u0600-\u06FF]+$/
I'm not sure if "Arabic spaces" that you mentioned are included in the character range there, but if you want to allow white space in the string then just add a \s inside the [] brackets.
You can explicitly allow some keys e-g: numpad, backspace and space, please check the code snippet below:
function restrictInputOtherThanArabic($field)
{
// Arabic characters fall in the Unicode range 0600 - 06FF
var arabicCharUnicodeRange = /[\u0600-\u06FF]/;
$field.bind("keypress", function(event)
{
var key = event.which;
// 0 = numpad
// 8 = backspace
// 32 = space
if (key==8 || key==0 || key === 32)
{
return true;
}
var str = String.fromCharCode(key);
if ( arabicCharUnicodeRange.test(str) )
{
return true;
}
return false;
});
}
// call this function on a field
restrictInputOtherThanArabic($('#firstnameAr'));

regular expression in javascript which allows backspace

My regular expression which allows characters, numbers, dot and underscore is
var numericReg = /^[a-zA-Z0-9\._]+$/;
How could i allow backspace in this reg ex.?
You can use [\b] to match backspace. So, just add it to your character class: -
var numericReg = /^[a-zA-Z0-9._\b]+$/;
Note that you don't need to escape dot (.) in character class. It has not special meaning in there.
See also: -
http://www.regular-expressions.info/reference.html
for more escape sequences, and patterns in Regex.
I'd suggest you rewrite your regex to :
var numericReg = /^[a-zA-Z0-9._]+|[\b]+$/
Or:
var numericReg = /^(?:[a-zA-Z0-9._]|[\b])+$/
Check against 'event.keyCode' and 'value.length' before checking the regular expression.
Keycode 8 = backslash
$('#my-input').on('keypress change', function(event) {
// the value length without whitespaces:
var value_length = $(this).val().trim().length;
// check against minimum length and backspace
if (value_length > 1 && event.keyCode != 8) {
var regex = new RegExp('/^[a-zA-Z0-9\._]+$/');
var key = String.fromCharCode(!event.charCode ? event.which : event.charCode);
if (!regex.test(key)) {
event.preventDefault();
return false;
}
}
}
The optimal solution for this problem is to check the value of textbox >0 before validating. This will help to solve error showing while pressing backspace in an empty textbox..!!
I also made a input type text that accept only numbers(non decimal) and backspace keyboard. I notice that putting [\b] in regular expression is not needed in non Firefox browser.
var regExpr = new RegExp("^[0-9,\b][0-9,\b]*$");

Jquery / Javascript Regex

Trying to get the correct regex for this - only letters, spaces, hypens, and commas. So far this only works if you only input 1 charactor. Any more then that, and it returns false. Anyone able to help?
$('#submit').click(function () {
var locationtest = /[^a-zA-Z \-\.\,]/;
if (!locationtest.test($('#location').val())) {
alert('Nope, try again!');
$('#location').val('')
return false;
} else {
alert('You got it!');
}
});`
This should do it, it matches 1 or more characters within the set you described
/^[a-zA-Z \-\,]+$/
I took out the \., your description says letters, spaces, hyphens, commas
You're close, you just need to specify how many times you want the character to appear.
The following code would specify 0 or more times
var locationtest = /[^a-zA-Z -.\,]*/;
And this code would specify 1 or more times
var locationtest = /[^a-zA-Z -.\,]+/;
The importance being the * and + characters.
Add a quantifier + and the global flag /g:
var locationtest = /[^a-zA-Z \-\.\,]+/g;
Your expression is correct, you just need to invert the match result.
/[^a-zA-Z \-\.\,]/
Will match if the string contains any char that is not what you want (the leading ^ in the character class).
I.e remove the !:
var locationtest = /[^a-zA-Z \-\.\,]/;
if (locationtest.test($('#location').val())) {
alert('Nope, try again!');
$('#location').val('')
return false;
} else {
alert('You got it!');
}
Note that empty string will pass as valid, if you don't want that, you can use this instead:
/[^a-zA-Z \-\.\,]|^$/

RegEx for Javascript to allow only alphanumeric

I need to find a reg ex that only allows alphanumeric. So far, everyone I try only works if the string is alphanumeric, meaning contains both a letter and a number. I just want one what would allow either and not require both.
/^[a-z0-9]+$/i
^ Start of string
[a-z0-9] a or b or c or ... z or 0 or 1 or ... 9
+ one or more times (change to * to allow empty string)
$ end of string
/i case-insensitive
Update (supporting universal characters)
if you need to this regexp supports universal character you can find list of unicode characters here.
for example: /^([a-zA-Z0-9\u0600-\u06FF\u0660-\u0669\u06F0-\u06F9 _.-]+)$/
this will support persian.
If you wanted to return a replaced result, then this would work:
var a = 'Test123*** TEST';
var b = a.replace(/[^a-z0-9]/gi, '');
console.log(b);
This would return:
Test123TEST
Note that the gi is necessary because it means global (not just on the first match), and case-insensitive, which is why I have a-z instead of a-zA-Z. And the ^ inside the brackets means "anything not in these brackets".
WARNING: Alphanumeric is great if that's exactly what you want. But if you're using this in an international market on like a person's name or geographical area, then you need to account for unicode characters, which this won't do. For instance, if you have a name like "Âlvarö", it would make it "lvar".
Use the word character class. The following is equivalent to a ^[a-zA-Z0-9_]+$:
^\w+$
Explanation:
^ start of string
\w any word character (A-Z, a-z, 0-9, _).
$ end of string
Use /[^\w]|_/g if you don't want to match the underscore.
/^([a-zA-Z0-9 _-]+)$/
the above regex allows spaces in side a string and restrict special characters.It Only allows
a-z, A-Z, 0-9, Space, Underscore and dash.
^\s*([0-9a-zA-Z]*)\s*$
or, if you want a minimum of one character:
^\s*([0-9a-zA-Z]+)\s*$
Square brackets indicate a set of characters. ^ is start of input. $ is end of input (or newline, depending on your options). \s is whitespace.
The whitespace before and after is optional.
The parentheses are the grouping operator to allow you to extract the information you want.
EDIT: removed my erroneous use of the \w character set.
For multi-language support:
var filtered = 'Hello Привет 你好 123_456'.match(/[\p{L}\p{N}\s]/gu).join('')
console.log(filtered) // --> "Hello Привет 你好 123456"
This matches any letter, number, or space in most languages.
[...] -> Match with conditions
[ab] -> Match 'a' OR 'b'
\p{L} -> Match any letter in any language
\p{N} -> Match any number in any language
\s -> Match a space
/g -> Don't stop after first match
/u -> Support unicode pattern matching
Ref: https://javascript.info/regexp-unicode
This will work
^(?=.*[a-zA-Z])(?=.*[0-9])[a-zA-Z0-9]+$
It accept only alphanumeriuc characters alone:
test cases pased :
dGgs1s23 - valid
12fUgdf - valid,
121232 - invalid,
abchfe - invalid,
abd()* - invalid,
42232^5$ - invalid
or
You can also try this one. this expression satisfied at least one number and one character and no other special characters
^(?=.*[0-9])(?=.*[a-zA-Z])([a-zA-Z0-9]+)$
in angular can test like:
$scope.str = '12fUgdf';
var pattern = new RegExp('^(?=.*[0-9])(?=.*[a-zA-Z])([a-zA-Z0-9]+)$');
$scope.testResult = pattern.test($scope.str);
PLUNKER DEMO
Refered:Regular expression for alphanumeric in Angularjs
Instead of checking for a valid alphanumeric string, you can achieve this indirectly by checking the string for any invalid characters. Do so by checking for anything that matches the complement of the valid alphanumeric string.
/[^a-z\d]/i
Here is an example:
var alphanumeric = "someStringHere";
var myRegEx = /[^a-z\d]/i;
var isValid = !(myRegEx.test(alphanumeric));
Notice the logical not operator at isValid, since I'm testing whether the string is false, not whether it's valid.
I have string similar to Samsung Galaxy A10s 6.2-Inch (2GB,32GB ROM) Android 9.0, (13MP+2MP)+ 8MP Dual SIM 4000mAh 4G LTE Smartphone - Black (BF19)
Below is what i did:
string.replace(/[^a-zA-Z0-9 ,._-]/g, '').split(',').join('-').split(' ').join('-').toLowerCase()
Notice i allowed ,._- then use split() and join() to replace , to - and space to - respectively.
I ended up getting something like this:
samsung-galaxy-a10s-6.2-inch-2gb-32gb-rom-android-9.0-13mp-2mp-8mp-dual-sim-4000mah-4g-lte-smartphone-black-bf19-20 which is what i wanted.
There might be a better solution but this is what i found working fine for me.
Extend the string prototype to use throughout your project
String.prototype.alphaNumeric = function() {
return this.replace(/[^a-z0-9]/gi,'');
}
Usage:
"I don't know what to say?".alphaNumeric();
//Idontknowwhattosay
Even better than Gayan Dissanayake pointed out.
/^[-\w\s]+$/
Now ^[a-zA-Z0-9]+$ can be represented as ^\w+$
You may want to use \s instead of space. Note that \s takes care of whitespace and not only one space character.
Input these code to your SCRATCHPAD and see the action.
var str=String("Blah-Blah1_2,oo0.01&zz%kick").replace(/[^\w-]/ig, '');
JAVASCRIPT to accept only NUMBERS, ALPHABETS and SPECIAL CHARECTERS
document.getElementById("onlynumbers").onkeypress = function (e) {
onlyNumbers(e.key, e)
};
document.getElementById("onlyalpha").onkeypress = function (e) {
onlyAlpha(e.key, e)
};
document.getElementById("speclchar").onkeypress = function (e) {
speclChar(e.key, e)
};
function onlyNumbers(key, e) {
var letters = /^[0-9]/g; //g means global
if (!(key).match(letters)) e.preventDefault();
}
function onlyAlpha(key, e) {
var letters = /^[a-z]/gi; //i means ignorecase
if (!(key).match(letters)) e.preventDefault();
}
function speclChar(key, e) {
var letters = /^[0-9a-z]/gi;
if ((key).match(letters)) e.preventDefault();
}
<html>
<head></head>
<body>
Enter Only Numbers:
<input id="onlynumbers" type="text">
<br><br>
Enter Only Alphabets:
<input id="onlyalpha" type="text" >
<br><br>
Enter other than Alphabets and numbers like special characters:
<input id="speclchar" type="text" >
</body>
</html>
A little bit late, but this worked for me:
/[^a-z A-Z 0-9]+/g
a-z : anything from a to z.
A-Z : anything from A to Z (upper case).
0-9 : any number from 0 to 9.
It will allow anything inside square brackets, so let's say you want to allow any other character, for example, "/" and "#", the regex would be something like this:
/[^a-z A-Z 0-9 / #]+/g
This site will help you to test your regex before coding.
https://regex101.com/
Feel free to modify and add anything you want into the brackets.
Regards :)
It seems like many users have noticed this these regular expressions will almost certainly fail unless we are strictly working in English. But I think there is an easy way forward that would not be so limited.
make a copy of your string in all UPPERCASE
make a second copy in all lowercase
Any characters that match in those strings are definitely not alphabetic in nature.
let copy1 = originalString.toUpperCase();
let copy2 = originalString.toLowerCase();
for(let i=0; i<originalString.length; i++) {
let bIsAlphabetic = (copy1[i] != copy2[i]);
}
Optionally, you can also detect numerics by just looking for digits 0 to 9.
Try this... Replace you field ID with #name...
a-z(a to z),
A-Z(A to Z),
0-9(0 to 9)
jQuery(document).ready(function($){
$('#name').keypress(function (e) {
var regex = new RegExp("^[a-zA-Z0-9\s]+$");
var str = String.fromCharCode(!e.charCode ? e.which : e.charCode);
if (regex.test(str)) {
return true;
}
e.preventDefault();
return false;
});
});
Save this constant
const letters = /^[a-zA-Z0-9]+$/
now, for checking part use .match()
const string = 'Hey there...' // get string from a keyup listner
let id = ''
// iterate through each letters
for (var i = 0; i < string.length; i++) {
if (string[i].match(letters) ) {
id += string[i]
} else {
// In case you want to replace with something else
id += '-'
}
}
return id
Alphanumeric with case sensitive:
if (/^[a-zA-Z0-9]+$/.test("SoS007")) {
alert("match")
}
Also if you were looking for just Alphabetical characters, you can use the following regular expression:
/[^a-zA-Z]/gi
Sample code in typescript:
let samplestring = "!#!&34!# Alphabet !!535!!! is safe"
let regex = new RegExp(/[^a-zA-Z]/gi);
let res = samplestring.replace(regex,'');
console.log(res);
Note: if you are curious about RegEx syntax, visit regexr and either use the cheat-sheet or play with regular expressions.
Edit: alphanumeric --> alphabetical
Only accept numbers and letters (No Space)
function onlyAlphanumeric(str){
str.value=str.value.replace(/\s/g, "");//No Space
str.value=str.value.replace(/[^a-zA-Z0-9 ]/g, "");
}
<div>Only accept numbers and letters </div>
<input type="text" onKeyUp="onlyAlphanumeric(this);" >
Here is the way to check:
/**
* If the string contains only letters and numbers both then return true, otherwise false.
* #param string
* #returns boolean
*/
export const isOnlyAlphaNumeric = (string: string) => {
return /^(?=.*[a-zA-Z])(?=.*[0-9])[a-zA-Z0-9]+$/.test(string);
}
Jquery to accept only NUMBERS, ALPHABETS and SPECIAL CHARECTERS
<html>
<head>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
</head>
<body>
Enter Only Numbers:
<input type="text" id="onlynumbers">
<br><br>
Enter Only Alphabets:
<input type="text" id="onlyalpha">
<br><br>
Enter other than Alphabets and numbers like special characters:
<input type="text" id="speclchar">
<script>
$('#onlynumbers').keypress(function(e) {
var letters=/^[0-9]/g; //g means global
if(!(e.key).match(letters)) e.preventDefault();
});
$('#onlyalpha').keypress(function(e) {
var letters=/^[a-z]/gi; //i means ignorecase
if(!(e.key).match(letters)) e.preventDefault();
});
$('#speclchar').keypress(function(e) {
var letters=/^[0-9a-z]/gi;
if((e.key).match(letters)) e.preventDefault();
});
</script>
</body>
</html>
**JQUERY to accept only NUMBERS , ALPHABETS and SPECIAL CHARACTERS **
<!DOCTYPE html>
$('#onlynumbers').keypress(function(e) {
var letters=/^[0-9]/g; //g means global
if(!(e.key).match(letters)) e.preventDefault();
});
$('#onlyalpha').keypress(function(e) {
var letters=/^[a-z]/gi; //i means ignorecase
if(!(e.key).match(letters)) e.preventDefault();
});
$('#speclchar').keypress(function(e) {
var letters=/^[0-9a-z]/gi;
if((e.key).match(letters)) e.preventDefault();
});
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js">
Enter Only Numbers:
Enter Only Alphabets:
Enter other than Alphabets and numbers like special characters:
</body>
</html>

Categories