I have a signup form where user can enter, along other information, company's name and company's URL ID. Now, I'd like to suggest "URL ID" to the user so when he types "name", "URL ID" should be based on this input (very similar to Facebook "name" and "username" paradigms). I should also mention that user can manually type in "URL ID" for corrections after it was suggested.
It's important to mention here that based on this question I was able to successfully implement server-side validation for the "name" field using the following Regex expression (client-side validation is not needed):
/^[\p{L}\p{N}]+(?:[- \'\x26][\p{L}\p{N}]+| [\x26] [\p{L}\p{N}]+)*$/iu
There are certain rules that must be applied to URL IDs:
- Valid characters are: both lower- and uppercase letters (Latin only), numbers, dashes, underlines and dots
- Must begin and end with a letter or number
- Must not have more than one special character (dash, underline or dot) in row
- Can have multiple special characters in "URL ID"
As an example of what's valid and what's not, here are some examples:
Valid inputs
- myusername
- my.username12
- my.user20_name
- 8-user-name-my
Invalid inputs
- myuser20name.
- _myusername10
- my..username
- myuser-.name
To make the long story short, two things need to be done:
- while user is typing in/pasting the "name" field, I need to take input on-the-fly, keep only allowed characters discarding the rest, and filling in the "URL ID" field with the filtered input
- while user is typing in/pasting the "URL ID" field, I need input to validates against the rules mentioned above so that for example typing in "my.user-" would be ok (although it would fail the server-side validation due to "-" being the last character), but typing additional "-" would not be allowed
I guess I only need the valid Regex expression, I'm able to code the rest myself. Any help would be appreciated.
