Allow only certain characters - javascript

I'd like to block all characters from being inputed except 0-9,a-z,A-Z range only alphanumeric characters. So when someone types ! for examplee nothing is written into input. How can I do that?


You need to write a function that listens for the onkeypress event for the form field, then check to see if the form contains any unwanted characters, and if it does, you update the field with those characters removed.


Or maybe you can use Alphanumeric Plugin for jQuery :
$('#yourInput').alphanum();

Related

Ways to prevent survey respondents from inputting spaces as their first character

I am basically new to html/css/javascript and I just got thrown a problematic issue.
I have a text box for my "Others, please specify" option. However, there are instances where some respondents can proceed to the next question by just entering a space and nothing else. When I download my data, the field became blank and hence more cleaning work is needed.
Just wondering if there any ways (html, css or javascript) that I can make use of to prevent my respondents from entering just spaces for the very first character. Any help would be appreciated. Thank you.

Put the required input in a form with a pattern which requires non-space characters:
<form>
<input required pattern="\S.*">
<button>submit</button>
</form>
\S.* means - match one non-space character (at the beginning of the string), followed by anything.

Consider using RegEx and use your desired pattern. In your case /[^\s]/ (matches anything that is not a whitespace character) will do.

html url input disable keyboard autospace after sentence (mobile)

I have html input fields and in mobile devices, the keyboard automatically adds spaces after sentence.
This is problematic for a input of type "url". How do I disable it?
I tried the following and still adds a space after the period in the domain name.

Assuming you have your input stored in a variable and that you are interested in its value only when you do a submit, you can easily trim its value with
yourInput.trim();
this will remove all leading and trailing spaces, thus cleaning your input.
If you want to delete the spaces directly when typing, you can attach that code to the change event:
yourInput.addEventListener('change', e => e.currentTarget.value.trim());

Ignore space changes in text field widget

Is there a way to ignore the spaces in the string of the text field on the 'change' event. For example #(x) ( sin(x) )and#(x) (sin(x)) are treated as two different function strings, and a change event is triggered on text field change

The solution is to watch for the input changes in JavaScript, when it change it will have value, save it into a variable removing all the whitespaces, next time when value comes remove all the whitespaces and compare with previous string variable, if both are same Do Nothing else Do Something! you can find sample code here.
For removing whitespace used this.

Regular expression ng-pattern angularjs

I have to validate an input field, but I have problems when the user copy and paste something inside the input
This is my code
<input type="text" ng-change="calculate()" ng-pattern="coordsPattern" ng-model="from" class="input-coords" placeholder="(x|y)">
where the coordsPattern is:
$scope.coordsPattern = /^\(?\-?\d{1,3}\|\-?\d{1,3}\)?$/;
the input can take
(158|158)
-158|158
(-158|158
.....etc
but when the user copy and paste the same thing from a different page, depending on browser to browser, the input looks like (158|158) but the pattern is invalid because when copying there are hidden tabs or spaces between chars. for example
((tab)(tab)158(tab)|(tab)(tab)-158(tab)
but in the input text looks like (158|-158 so for the user is a valid input
the input is valid (because in the calculate() function I clean the input from spaces and tabs) but invalid with that pattern and angular doesn't execute the calculate() function.
this one is a copy&paste text which includes hidden tabs
(‭-‭91‬‬|‭-‭18‬‬)
Thank you
EDIT
this is the var_dump of the string
string '(‭-‭91‬‬|‭-‭18‬‬)' (length=33)
it contains special chars! neither tabs or spaces!
maybe I have to find a different solution to validate the input...

$scope.coordsPattern = /^\s*?\(?\s*?\-?\s*?\d{1,3}\s*?\|\s*?\-?\s*?\d{1,3}\s*?\)?\s*?$/;
This should match the expected input even when there are whitespace characters inserted.

PHONE VALIDATION: How To Overwrite Text In a Textbox When Typing Without Clearing Whole Field?

I would like to know how to create a script that overwrites text that is already in a text box. (in jquery or javascript)
Example: If I have a text phone field that says:
+1 (xxx) xxx-xxxx
When a user clicks the field, I want the characters to remain, and the focus set to the 4TH character in the text box, just after the 1.
Then, as a user types each number, it overwrites the x one by one, until all the x's are gone. But, I want the parenthesis and hyphen formatting to stay, so the users input forms around the formatting.
I would also like this form to only allow numbers, hyphens, and parenthesis, and not allow submitting if x's still exist.
If you can help me with this, THANK YOU! :-)

Try masked input plugin # [
http://digitalbush.com/projects/masked-input-plugin/
]1
Looks like it matches what you need.

Categories

Resources