Getting undefined from ajax call

Question

I am getting undefined from an ajax call while the variables I pass through exist for sure.

This is my ajax function:

function setMessages(roomId, username, message){
    $.ajax({
        type: "get",
        url: "http://www.sinansamet.nl/chatdistract/ajax/setMessages.php",
        data: { roomId:roomId, username:username, message:message },
        success: function(html) {
                  strReturn = html;
                }
        });
}

My PHP:

<?php
$roomdId = $_GET['roomId'];
$username = $_GET['username'];
$message = $_GET['message'];


echo $username;
?>

Calling ajax:

$(document).on("click", "#messageSubmit", function(){
    var username = window.localStorage["username"];
    var message = $("#message").val();
    alert(setMessages(roomId, username, message));
    alert(roomId + username + message);
});

The first alert returns undefined. No matter which variable I use. The second alert returns all 3 variables like they are supposed to be. So they do exist for sure. I am using phonegap for this but it does the same on desktop browser.

you are not returning anything. Do `return strReturn` at the end of the success callback. It is the return type that it is alerting. — karthikr, Jun 06 '13 at 20:18
AJAX is asynchronous. Everything that depends on the result must be done in the callback. — Barmar, Jun 06 '13 at 20:19
I get the right alert now but now it gives me a PHP error in the alert box saying the variables arnt defined in the php file. — Sinan Samet, Jun 06 '13 at 20:26
possible duplicate of [How to return the response from an AJAX call?](http://stackoverflow.com/questions/14220321/how-to-return-the-response-from-an-ajax-call) — Qantas 94 Heavy, Feb 04 '14 at 02:48

score 2 · Answer 1 · answered Jun 06 '13 at 20:21

The function does not return a value, and even if it did, ajax is async, so you'll have to wait until the data is returned before you can use it :

function setMessages(roomId, username, message){
    return $.ajax({
        type: "get",
        url: "http://www.sinansamet.nl/chatdistract/ajax/setMessages.php",
        data: { roomId:roomId, username:username, message:message }
    });
}

$(document).on("click", "#messageSubmit", function(){
    var username = window.localStorage["username"],
        message  = $("#message").val();

    setMessages(roomId, username, message).done(function(data) {
        alert(data);
    });
});

score 1 · Answer 2 · answered Jun 06 '13 at 20:21

1

try:

function setMessages(roomId, username, message){
  var strReturn = '';

  $.ajax({
    type: "get",
    url: "http://www.sinansamet.nl/chatdistract/ajax/setMessages.php",
    data: { roomId:roomId, username:username, message:message },
    success: function(html) {
              strReturn = html;
            },
    async: false
  });
  return strReturn;
}

answered Jun 06 '13 at 20:21

GGio

7,563
11
44
81

Synchronous AJAX should only be recommended if there's no good alternative. – Barmar Jun 06 '13 at 20:22
1

@Barmar - In other words, never ? – adeneo Jun 06 '13 at 20:23

score 0 · Answer 3 · answered Jun 06 '13 at 20:23

Try the following

function setMessages(roomId, username, message){
    return $.ajax({
        type: "get",
        url: "http://www.sinansamet.nl/chatdistract/ajax/setMessages.php",
        data: { roomId:roomId, username:username, message:message },
        success: function(html) {
                  strReturn = html;
                }
        });
}


<?php
$roomdId = $_GET['roomId'];
$username = $_GET['username'];
$message = $_GET['message'];


echo $username;
?>


$(document).on("click", "#messageSubmit", function(){
    var username = window.localStorage["username"];
    var message = $("#message").val();
    setMessages(roomId, username, message).done(function (){
        alert(strReturn);
        alert(roomId + username + message);
    });
});

Getting undefined from ajax call

3 Answers3