jQuery Validation and Alphanumeric Additional Methods

JavaScript
1

OK, I’m trying to get the alphanumeric/additional methods working with the validation plugin, but so far, I can’t make it fire. I’ve read through the plugin docs and multiple example on Stack and it just isn’t doing the validation. It’s not throwing any errors either. Anyone see what I’m missing?

here’s the JS:


<script type="text/javascript" src="scripts/jquery-1.7.1.min.js"></script>
<script type="text/javascript" src="scripts/jquery-validation/jquery.validate.min.js"></script>
<script type="text/javascript" src="scripts/jquery-validation/additional-methods.min.js"></script>
<script type="text/javascript">

	$(document).ready(function(){

		var validator=$("#registration").validate({
	        rules: {
	            "user_name": {
	                required: true,
	                alphanumeric: true,
	                rangelength: [7, 15]

	            }
	        },
	        messages: {
	            "user_name": {
	                required: "You must enter a Username",
	                alphanumeric: "Login format not valid",
	                rangelength: "Username improper length"
	            }
	        }
	    });
	});
	</script>

form bit:


<div><label for="user_name">User Name</label>
<input name="user_name" id="user_name" type="text" maxlength="15" /></div>
2

I’ve even tried this with no luck either


<script type="text/javascript">

	$.validator.addMethod("loginRegex", function(value, element) {
        return this.optional(element) || /^[a-z0-9\\-]+$/i.test(value);
    }, "Username must contain only letters, numbers, or dashes.");

	$(document).ready(function(){

		$("#registration").validate({
	        rules: {
	            "user_name": {
	                required: true,
	                rangelength: [7, 15],
	                loginRegex:true

	            },
	            "user_pw2":{
	            	required: true,
	            	equaltTo: "#user_password",

	            },
	            "user_email":{
	            	required: true,
	            	email: true
	            }
	        },
	        messages: {
	            "user_name": {
	                required: "You must enter a Username",
	                rangelength: "Username improper length",
                	loginRegex: "Login format not valid"
	            },
	            "user_pw2":{
	            	required:"Repeat your password",
	            	equaltTo:"Enter same password as above"
	            },
	            "user_email":{
	            	required: "You must enter an email address",
	            	email: "Improper email format"
	            }
	        }
	    });
	});
	</script>
3

Your first code example works for me. Have you checked that the scripts are accessible?

If you link to a test page that demonstrates the problem, we can find out what else is causing the problem.

4

It looks like you want a 7-15 character alpha-numeric string.

You can do that without using some plug-in or jquery.

       
        <form action="" method="post">
            <input type="text" name="txtUsername" id="txtUsername" maxlength="15" onblur="testThis(this.value)" />
        </form>

       <script type="text/javascript">
                       function testThis(val){
                var str = (/^[\\da-z]{7,15}$/.test(val.toLowerCase()))? 'valid' : 'invalid';
                alert('username is '+ str);
            }
        </script>

The onblur is just for testing purposes.

5

I hope to have it set up this week. Thanks.

Sure, have done it many times. But that wasn’t the question now though, was it? :wink:

6

Not sure.

Lot’s of noobies, and I’m not saying you’re one, come to forums like this asking for help with jquery, plug-ins or whatever, thinking that jquery is some sort of shortcut to learning javascript (when it clearly isn’t) and also not realising that what they want to do can very often be done much easier with vanilla javascript and always with much less code if they go look at the code jquery runs in the background to perform a given task.

7

fair enough and valid points. thanks for the input.