Ajax, JS function returning undefined value

Question

I am very new to all of this, I am tying to learn Ajax as well as Javascript, I am getting the value from a php file, but when I try to return the value in the method I get a undefined value which i log in the console., I am after trying a lot of thing but with no success. Can some one please educate me on this. And please criticize me code im sure there is a lot of bad practice.

Thanks

 function checkEmail(){
    var xhttp; 
    var status;

    xhttp = new XMLHttpRequest();

    var email = document.getElementById('email2').value;
    
    xhttp.onreadystatechange = function() {
      if (xhttp.readyState == 4 && xhttp.status == 200) {
            var xmlResponse = xhttp.responseText;      
            status = xmlResponse;
            
        }
    };


    xhttp.open("GET", "php/ajaxCom.php?email="+email, true);
    xhttp.send();

    return status;
 }

<?php
 include 'base.php';
 $status;

 $email_in_use = $_GET['email'];

 $query = mysqli_query($link, "SELECT * FROM users WHERE email='".$email_in_use."'");

 if(mysqli_num_rows($query) > 0){
     $status = "false";
 }else{
  $status = "true";
 }
 echo $status;
?>

This is where I call the checkEmail

function getStatus(field, name, value) {
     var status = null;

     if (!field.attr('required')) return null;
     if (!value) status = 'Please fill out the required field: ' + name;
     else if (emailField.test(name) || emailField.test(field.attr('type'))) {

        var b = checkEmail();
        console.log(b);
       if (!emailValue.test(value)) {
        status = 'Please enter a valid email address for: ' + name;
        }else if ( b == "false"){
         alert("im here");
       status = 'Please enter a valid email this email already has an acount';
      }


     }
     return status;
   }

update

The stats alert is shown correctly but the console log is still showing undefined

function getStatus(field, name, value) {
     var status = null;

     if (!field.attr('required')) return null;
     if (!value) status = 'Please fill out the required field: ' + name;
     else if (emailField.test(name) || emailField.test(field.attr('type'))) {
      var b;
      
        checkEmail(function(status) {
       alert('Status: ' + status);
       b = status;
   });
        console.log(b);


       if (!emailValue.test(value)) {
        status = 'Please enter a valid email address for: ' + name;
        }else if ( b == "false" || b == "true"){
         alert("im here");
       status = 'Please enter a valid email this email already has an acount';
      }


     }
     return status;
   }

where you are getting problem, means which line. Also show us `ajaxCom.php` code? — Alive to die - Anant, Mar 15 '16 at 09:51
**Danger**: You are **vulnerable to [SQL injection attacks](http://bobby-tables.com/)** that you need to [defend](http://stackoverflow.com/questions/60174/best-way-to-prevent-sql-injection-in-php) yourself from. — Quentin, Mar 15 '16 at 09:57
@Anant There I done an update sorry. I am getting the problem calling it in the get status function — Amy Hyland, Mar 15 '16 at 09:57

score 0 · Answer 1 · answered Mar 15 '16 at 09:58

0

You're returning status immediately, where as the actual AJAX calls returns asynchronously.

You need to change your flow so that checkEmail would accept a callback function as parameter instead of returning it. Something like that:

function checkEmail(callback) {
    xhttp.onreadystatechange = function() {
        if (xhttp.readyState == 4 && xhttp.status == 200) {
        var xmlResponse = xhttp.responseText;      
        status = xmlResponse;

        callback(status);
    }
};

...

checkEmail(function(status) {
    alert('Status: ' + status);
});

answered Mar 15 '16 at 09:58

obe

7,378
5
31
40

I am still geting undefined value in getstatus for b in the console log but the alert is showing the correct text why is this – Amy Hyland Mar 15 '16 at 10:10
Inside *checkEmail()* the *return status;* statement is executed **before** a value is actually put in *status*, so at that time it is *undefined*. – obe Mar 15 '16 at 10:13

Ajax, JS function returning undefined value

1 Answers1