cannot get data from ajax

cannot get data from ajax

hello
i was creating live username check for learning

here my code
login.php
$. ajax({
                 url:  "cek_username.php",
                 type:  "post",
                 data:  "username=" + username,
                 success:  function( data){
                     if( data  ==  0)
                    {
                         $( "#idErr"). html( "username tersedia");
                         $( "#id_daftar"). css( "outline-color", "green");         
                    }
                     else
                    { 
                         $( "#idErr"). html( "username tidak tersedia");
                         $( "#id_daftar"). css( "outline-color",  "red");
                         console. log( data);
                         error_username  =  true;
                    }
                },
            });

cek_username.php (code for check username avaibility on database)
<?php
      include  "koneksi.php";

      $username  =  $_POST[ 'username'];

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

      echo  $data;
?>

here is the form
< 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"  autocomplete= "off" 
       maxlength= "16"  value= "" />
     < div  class= "error"  id= "idErr"></ div>
</ div>

console.log

so i created in 2 php file, 1 is simple one for my learning purpose
but after i implemented to another php for my project, it cannot get value from cek_username.php, and i dont know why
please help

thanks