html url input disable keyboard autospace after sentence (mobile) - javascript

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

Related

HTML input box, how to prevent key repeat when key is held down

Is there a way to prevent auto-repeat behavior in an HTML input (type="text")?
So that when you hold down the a key while in the input box, only one character is used, instead of repeating the character until the user releases the key.
I know how to do this for key-events in the browser but HTML input type="text" boxes seems to be in a world of their own.

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.

Prevent user from chaning tokens within input box

How to prevent the change of certain elements, tokens, within a textarea with javascript or jquery? For instance I have this string in an input
this is normal text {this can't be changed 1}. This is more text. {This can't be changed 2 }. And some more text
If a user tries to change text within the curly brackets I want to prevent that from happening.
I thought of finding the indexes of the start and stop indexes of the tokens and when a user tries to change an element, I would see if it falls within that range.
Is there a different approach that I can use?
You could use a regular expression to read everything between {} into an array when the page loads. Then when the form submits do that same thing again and compare them to make sure they are the same.
You should build a regular expression that validates the validity of the text. on every keydown event in the textarea revalidate the regex and notify the user / prevent the keypress.
As text can also be changes in other ways (paste, autocomplete, etc.) you should also validate on change event of the textarea.

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.

Allow only certain characters

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

Categories

Resources