Getting undefined from ajax request

Question

Possible Duplicate:
How to return AJAX response Text?
How to return the response from an AJAX call from a function?

I am trying to get a record from SQL according to the value I send with ajax. But all I get is undefined when I console.log it.

jQuery:

function extraOptions(str){
    $.get("inc/ajax/extra_options.php",
        {q:str},
        function(html){
           return html;
        }
    );
}

$("#auto_model").change(function(){
   console.log(extraOptions(this.value));
});

extra_options.php:

$q = $_GET['q'];

echo extra_options($mysqli, $q);

extra_options function:

function extra_options($mysqli, $q){
    $query = "SELECT
                                extra_options
                            FROM
                                vozila_tbl
                            WHERE
                                Model_vozila = '".$mysqli->real_escape_string($q)."'";
    $result = $mysqli->query($query);
    $row = $result->fetch_assoc();

    return $row['extra_options'];
}

Edit:

It should return 1 or 0 and if it returns 0 I want to change the updateField function with an if statement.

function updateField(str, id, prevvalue, value, vehicletype){
    $.get("inc/ajax/form_rest.php",
        {q:str, prevvalue:prevvalue, value:value, vehicletype:vehicletype},
        function(html){
           $('#'+id).html(html);
        }
    );
}

$("#auto_model").change(function(){
   updateField(this.value, 'auto_bodywork', 3, 4, this.parentNode.id), resetBelow(2,'auto'), show('auto_bodywork');
});

The line I need to change in the if statement is:

updateField(this.value, 'auto_bodywork', 3, 4, this.parentNode.id), resetBelow(2,'auto'), show('auto_bodywork');

Depends on the value. If extra_options is set to 1 it returns 1. It is about a select menu which returns the value as q in the where statement of my php function. If it returns 1 I want it to return more select fields. Just like on this website: http://www.onderdelenzoeker.nl/ when you choose 2011>Renault>Master for example — Sinan Samet, Feb 04 '13 at 21:39
I wanted to check it with console.log if it returns 1. I did not try out without console.log yet. Would extraOptions(this.value) == 1 be true the way I have it now? Sorry for confusing you — Sinan Samet, Feb 04 '13 at 21:45
The `extraOptions` function doesn't return a value of any kind. So, it will always be `== undefined`. AJAX is asynchronous. You might want to lookup what that means. I'm still unclear on what exactly you are trying to accomplish with these functions. You are binding two different functions to the same event on the same object - I'm not sure how they are supposed to relate. — crush, Feb 04 '13 at 21:48
Ive been working on this problem for days now but cant figure it out. I thought that maybe if I call this function first it would react on the if statement in the next function.. I just wanted this function to give a variable with the return in it — Sinan Samet, Feb 04 '13 at 21:52
I updated my answer with my best guess at what you are attempting to do. I think your main problem is that you don't understand what `asynchronous` means, or how it acts. It doesn't block execution until it returns. It returns immediately, and calls the callback when it receives a response from your AJAX call - whenever that may be. — crush, Feb 04 '13 at 21:53

crush · Accepted Answer · 2013-02-04T22:15:59.207

3

Your return statement is returning from the anonymous function, not from extraOptions(). Thus, extraOptions() returns undefined because it is returning nothing.

Try this instead:

function extraOptions(str){
    $.get("inc/ajax/extra_options.php",
        {q:str},
        function(html){
           console.log(html);
        }
    );
}

$("#auto_model").change(function(){
   extraOptions(this.value);
});

If I understand you right, the following code should do what you want:

$("#auto_model").change(function(e) {
    extraOptions(this.value, this.parentNode.id);
});

function extraOptions(str, parentNodeId) {        
    $.get("inc/ajax/extra_options.php",
        {q:str},
        function(data) {
            if (data == "1") {
                updateField(str, "auto_bodywork", 3, 4, parentNodeId);
            } else if (data == "0") {
                updateField(str, "auto_type", 5, 7, parentNodeId);
            } else {
                //Not 0 or 1.
            }

            resetBelow(2, "auto");
            show("auto_bodywork");
        }
    );
}

function updateField(str, id, prevvalue, value, vehicletype){
    $.get("inc/ajax/form_rest.php",
        {q:str, prevvalue:prevvalue, value:value, vehicletype:vehicletype},
        function(html){
           $('#'+id).html(html);
        }
    );
}

edited Feb 04 '13 at 22:15

answered Feb 04 '13 at 21:29

crush

16,713
9
59
100

I will edit my question to explain my question better – Sinan Samet Feb 04 '13 at 21:31
I editted it. Its kinda complicated and I have tried getting an answer to this earlier without even this if statement idea but I didnt get response from anyone – Sinan Samet Feb 04 '13 at 21:36
That seems like its getting close but I want the updateField() function inside the extraOptions() function to change according to the response of the ajax return. For example if it returns 1 I want it to be updateField(str, "auto_bodywork", 3, 4, parentNodeId); and if it returns 0 I want it to be updateField(str, "auto_type", 5, 7, parentNodeId); – Sinan Samet Feb 04 '13 at 21:57
1

Updated with if statement. – crush Feb 04 '13 at 21:59
Awesome thank you I think that should work! You are a life saver! – Sinan Samet Feb 04 '13 at 22:00
1

Glad to help. Don't forget to look-up asynchronous (That's the A in AJAX btw), and how it performs differently than the thread-blocking procedural code you are used too. – crush Feb 04 '13 at 22:03
I will look it up but unfortunately it gives me the error "Cannot read property 'id' of undefined".. – Sinan Samet Feb 04 '13 at 22:09
Try again. I'm heading home. Will check again when I get there. – crush Feb 04 '13 at 22:15
Alright thank you, I am trying stuff out – Sinan Samet Feb 04 '13 at 22:17
The error is about this this.parentNode.id "this.parentNode" = undefined and id is the property that cant be read. – Sinan Samet Feb 04 '13 at 22:31
Oh im really sorry I didnt update the last edit. That was the problem it works prefectly now thanks a lot!!!! – Sinan Samet Feb 04 '13 at 22:50

Getting undefined from ajax request

1 Answers1