Question

So I am writing a registration form and I need the display name to be only numbers, letters and underscores.

Have a look at my code and tell me what I’m doing wrong.

<form method='post' action='/' onsubmit='return check_form()'>     <input type='text' id='display-name' name='display-name' maxlength='255' />     <input type='submit' /> </form> <script type='text/javascript'> <!--     var name_regex = /^([a-zA-Z0-9_])+/      function check_form()     {         if (!name_regex.test(document.forms[0].elements[0].value))         {             document.forms[0].elements[0].focus()             alert('Your display name may only contain letters, numbers and underscores')             return false         }     } --> </script> 

It’s obviously been trimmed down to not include anything not related to the problem but even this snippet doesn’t work.

Answer 1

Your regex

/^([a-zA-Z0-9_])+/ 

Looks for

1. Start of string(check), followed by
2. 1 or more letters, numbers, or underscore (check)

And then whatever comes after it doesn’t matter. This regex will match anything at all so long as it begins with a letter, number, or underscore

If you put a $ at the end, then it will work – $ matches ‘end of string’, so the only way it can match is if there are only numbers, letters, and underscores between the start and end of the string.

/^([a-zA-Z0-9_])+$/ 

Secondly, I’d suggest using document.getElementById('display-name').value instead of document.forms as it won’t break if you rearrange the HTML, and is more ‘the commonly accepted standard of what to do’