Regex Validation

[stevenmw]

How can I add

regex:"/^[a-0-9_-]$/",

to the code below and use it to validate the username field?

pic1 = new Image(16, 16); 
pic1.src = "loader.gif";
$(document).ready(function(){
$("#username").change(function() { 
var usr = $("#username").val();
if(usr.length >= 4)
{
$("#status").html('<img src="loader.gif" align="absmiddle">&nbsp;Checking availability...');
    $.ajax({  
    type: "POST",
    url: "check.php",  
    data: "username="+ usr,  
    success: function(msg){  
 
   $("#status").ajaxComplete(function(event, request, settings){ 
 if(msg == 'OK')
 { 
        $("#username").removeClass('object_error'); // if necessary
  $("#username").addClass("object_ok");
  $(this).html('&nbsp;<img src="tick.gif" align="absmiddle">');
 }  
 else  
 {  
  $("#username").removeClass('object_ok'); // if necessary
  $("#username").addClass("object_error");
  $(this).html(msg);
 }  
 
   });
 } 
 
  }); 
}
else
 {
 $("#status").html('<font color="red">The username should have at least <strong>4</strong> characters.</font>');
 $("#username").removeClass('object_ok'); // if necessary
 $("#username").addClass("object_error");
 }
});
});

[devnull69]

This is an invalid regex ... I suppose you meant something like

/^[a-z0-9_-]$/

Then you can do this

var myRegex = /^[a-z0-9_-]$/;
if(myRegex.test(usr)) {
   // this code will be executed if usr matches the regex
}

[stevenmw]

Where would I put it?

[devnull69]

Maybe here ... but this depends on where you want to validate the field :-)

$("#username").change(function() { 
   var usr = $("#username").val();
   var myRegex = /^[a-z0-9_-]$/;
   if(usr.length >= 4 && myRegex.test(usr))
   ...
});

[stevenmw]

Now the script is failing. Before it would check if a username were available after I entered 4 or more characters. Now no matter what it displays the errors 'must be more than 4'.

pic1 = new Image(16, 16); 
pic1.src = "loader.gif";
$(document).ready(function(){
$("#username").change(function() { 
   var usr = $("#username").val();
   var myRegex = /^[a-z0-9_-]$/;
   if(usr.length >= 4 && myRegex.test(usr))
 
{
$("#status").html('<img src="loader.gif" align="absmiddle">&nbsp;Checking availability...');
    $.ajax({  
    type: "POST",
 
    url: "check.php",  
    data: "username="+ usr,  
    success: function(msg){  
 
   $("#status").ajaxComplete(function(event, request, settings){ 
 if(msg == 'OK')
 { 
        $("#username").removeClass('object_error'); // if necessary
  $("#username").addClass("object_ok");
  $(this).html('&nbsp;<img src="tick.gif" align="absmiddle">');
 }  
 else  
 {  
  $("#username").removeClass('object_ok'); // if necessary
  $("#username").addClass("object_error");
  $(this).html(msg);
 }  
 
   });
 } 
 
  }); 
}
else
 {
 $("#status").html('<font color="red">The username should have at least <strong>4</strong> characters.</font>');
 $("#username").removeClass('object_ok'); // if necessary
 $("#username").addClass("object_error");
 }
});
});

[devnull69]

It will fail if the username does not validate

So if the username contains characters that don't match "a-z0-9_-" the "if" will return false and thus fail.

Does the username contain characters other then lower case characters, 0-9, underscore or dash?

[stevenmw]

No, even if the username matches the guidelines of the regex it fails.

[devnull69]

Try this ... with the old code it will always fail, because it will only test for exactly ONE character out of the list

$("#username").change(function() { 
   var usr = $("#username").val();
   var myRegex = /^[a-z0-9_-]+$/;
   if(usr.length >= 4 && myRegex.test(usr))

[stevenmw]

It works! What was the issue?

[devnull69]

See the "+" inside the regex?