How to use the username availability checker script in form validation jquery

Question

I am new to jquery. has i got the following code to check the username availability.

The script is working fine. to check the username avialble or not.

  <script type="text/javascript" src="http://jqueryjs.googlecode.com/files/jquery-1.3.2.min.js"></script>

 <script type="text/javascript">
$(function()
{
$('.user_name').keyup(function()
{
 var checkname=$(this).val();
var availname=remove_whitespaces(checkname);
 if(availname!=''){
 $('.check').show();
 $('.check').fadeIn(400).html('<img src="image/ajax-loading.gif" /> ');

 var String = 'username='+ availname;

   $.ajax({
       type: "POST",
      url: "available.php",
      data: String,
      cache: false,
      success: function(result){
           var result=remove_whitespaces(result);
           if(result==''){
                   $('.check').html('<img src="image/accept.png" /> This Username Is Avaliable');
                   $(".check").removeClass("red");
                   $('.check').addClass("green");
                   $(".user_name").removeClass("yellow");
                   $(".user_name").addClass("white");
           }else{
                   $('.check').html('<img src="image/error.png" /> This Username Is Already Taken');
                   $(".check").removeClass("green");
                   $('.check').addClass("red")
                   $(".user_name").removeClass("white");
                   $(".user_name").addClass("yellow");
           }
      }
  });
   }else{
     $('.check').html('');

  }
  });
  });

 function remove_whitespaces(str){
 var str=str.replace(/^\s+|\s+$/,'');
 return str;
}

available.php contains following code.

  if(isset($_POST['username']) && !empty($_POST['username'])){
  $username=mysql_real_escape_string($_POST['username']);
  $query="select * from sell where LOWER(uname)='$username'";
  $res=mysql_query($query);
  $count=mysql_num_rows($res);

  if($count > 0){
      echo "true";

  }else{
      echo "false";

  }
 }

Everything works fine. the ajax posting and checking the value exists or not.

But my problem is How i can include the above script in the following jquery validation script.

       $(document).ready(function(){
       $("#f2").validate({
         debug: false,
      rules: {    
              name: {
         required:true,
         minlength:3
//Here how to call the above script function..i stuck here..

            }
           });
           });

Based on the name availability i need to process the form to submit.php other wise the form won't be submitted..

Any suggestions,Acceptable.

http://stackoverflow.com/questions/241145/jquery-validate-plugin-how-to-create-a-simple-custom-rule — Nouphal.M, Dec 21 '13 at 06:39
@Nouphal.M, why would the OP need to create a custom rule when he could simply use [the `remote` method](http://jqueryvalidation.org/remote-method/)? — Sparky, Dec 22 '13 at 00:16

score 0 · Accepted Answer · answered Dec 21 '13 at 07:02

0

Add this script in validation function

<script>
   $(document).ready(function(){
   $("#f2").validate({
     debug: false,
     rules: {
        name: {
           required:true,
           minlength:3,
           remote:{
              url: "available.php",
              type: "post",
              data: {
                username: function() {
                   return $( ".user_name" ).val();
                }
              }
           }
        }
     }
   });
</script>

Remove "keyup" event function and than you are done...

answered Dec 21 '13 at 07:02

Akshay Paghdar

3,599
2
22
41

@PHPCoder, I think you need to go study [the documentation](http://jqueryvalidation.org/remote-method/) for a while. Coming here unprepared and unwilling to explain anything beyond, _"it's not working for me"_ is unacceptable. – Sparky Dec 22 '13 at 00:12
There is nothing wrong with this answer except that it missed the logical problem in the OP's PHP code... he echos `true` when there is a match in the database (fails validation) and echos `false` when there is no match in the database (passes validation). This is completely backwards. `true` means that the field passes validation and `false` means that it failed. – Sparky Dec 22 '13 at 00:13

How to use the username availability checker script in form validation jquery

1 Answers1