live form check availability

live form check availability

hello, 
i'm newbie of jquery and ajax, so i created based on website that i read
i already created simple live username check (and others) and i works

but after i implement on to my project, it dosen't works, why?

here the code:
form code

< form  name= "daftar"  method= "post"  onsubmit= " return   validate_daftar () ">
< div  class= "form-group">
    < label  for= "username">Username :</ label>
    < input  type= "text"  style= " max-width:90%; "  class= "form-control"  name= "id_daftar"  id= "id_daftar"  placeholder= "Masukkan Username Anda"  maxlength= "16"  autocomplete= "off"/>
    < div  class= "error"  id= "idErr"></ div>
</ div>
< div  class= "form-group">
    < label  for= "password">Password :</ label>
    < input  type= "password"  style= " max-width:90%; "  class= "form-control"  name= "pass"  id= "pass"  placeholder= "Masukkan Password Anda"  maxlength= "16"  value= "" />
    < input  type= "checkbox"  onclick= password ()> Tampil Password
    < div  class= "error"  id= "passErr"></ div>
</ div>
< div  class= "form-group">
    < label  for= "nama">Nama :</ label>
    < input  type= "text"  style= " max-width:90% "  class= "form-control"  name= "nama"  id= "nama"  maxlength= "50"  placeholder= "Masukkan Nama Sesuai KTP"  value= "" />
    < div  class= "error"  id= "namaErr"></ div>
</ div>
< div  class= "form-group">
    < label  for= "email">Email :</ label>
    < input  type= "email"  style= " max-width:90%; "  class= "form-control"  name= "email"  id= "email"  placeholder= "Masukkan Email Anda"  value= "" />
    < div  class= "error"  id= "emailErr"></ div>
</ div>
< div  class= "form-group">
    < label  for= "nomorhp">Nomor HP:</ label>
    < input  type= "number"  style= " max-width:90%; "  class= "form-control"  placeholder= "Masukkan Nomor HP Anda"  name= "nohp"  id= "nohp"  maxlength= "16"  value= "" />
    < div  class= "error"  id= "nohpErr"></ div>
</ div>
< button  type= "submit"  name= "daftar"  value= "daftar"  class= "btn btn-info">Daftar</ button>
</ div>
</ form>


jquery and ajax code:
$( document). ready( function(){
     $( '#id_daftar'). keyup( function(){
         var  id_daftar  =  $( '#id_daftar'). val();
         $. ajax({
             url:  "regis_username.php",
             type:  "post",
             data:  "id_daftar=" + id_daftar,
             dataType:  "text",
             success:  function( data)
            {       
                 if( data  ==  1)
                {
                     $( "#idErr"). html( "username tersedia");
                     $( "#idErr"). css( "outline-color",  "green");
                }
                 else
                {
                     $( "#idErr"). html( "username tidak tersedia");
                     $( "#idErr"). css( "outline-color",  "red");
                     console. log( id_daftar);
                     console. log( data);
                }
            },
        });
    });


searching code: (regis_username.php)
<?php
      include  "koneksi.php";

      $username  =  $_POST[ 'id_daftar'];

      $sql =  "select * from login where username = ' $username ' ";
      $query =  mysqli_query( $conn,   $sql);
      $count  =  mysqli_num_rows( $query);

      echo  $username. "-". $count;
? >


console.log


i don't know what wrong but, any help and explanation will be appreciated!