Javascript alert value after ajax request

Question

Why I can't alert x value after this ajax request? I work with error function.

           var x;

    $.ajax({
        url: 'http://gdata.youtube.com/feeds/api/videos/' + code,
        type: 'get',
        dataType: 'json',
        success: function(data) { 
           console.log('Result 1: ');
           console.log(data.responseText);
        },
        error: function(e) {
            var text = e.responseText;

            parser = new DOMParser();
            xmlDoc = parser.parseFromString(text, "text/xml");

            var titleXml = xmlDoc.getElementsByTagName('title')[0];
            var contentXml = xmlDoc.getElementsByTagName('content')[0];

            title = titleXml.childNodes[0];
            content = contentXml.childNodes[0];

            x = title;

        }
    });

    alert(x);

if I make alert local in error function everything work fine, but I need to alert x value after ajax.

not without changing the ajax settings, i.e. not by doing the call as the question was asked. In his question the call is made asynchronous. Thats why he can't! — Philip G, Nov 18 '13 at 12:25

score 2 · Answer 1 · edited Nov 18 '13 at 12:23

   $.ajax({
        url: 'http://gdata.youtube.com/feeds/api/videos/' + code,
        type: 'get',
        dataType: 'json',
        success: function(data) { 
           console.log('Result 1: ');
           console.log(data.responseText);
            alert(x);
//          ^^^^^^^^when get any success then use alert on ajax success
        },
        error: function(e) {
            var text = e.responseText;

            parser = new DOMParser();
            xmlDoc = parser.parseFromString(text, "text/xml");

            var titleXml = xmlDoc.getElementsByTagName('title')[0];
            var contentXml = xmlDoc.getElementsByTagName('content')[0];

            title = titleXml.childNodes[0];
            content = contentXml.childNodes[0];

            x = title;
            alert(x); 
//          ^^^^^^^^when get any error then use alert on ajax error  

        }
    });

thanks :) @LubomurMarshal feel happy its works for you – Rituraj ratan Nov 18 '13 at 12:26 — Rituraj ratan, Nov 18 '13 at 12:26

score 1 · Answer 2 · answered Nov 18 '13 at 12:21

The error or success functions are called in case of error or success of Ajax Request when it completes so the code that assigns the value to x would not have executed if you alert the value outside the functions.

The value of x is assigned after the request is completed so it works in case you have it alerted inside the error function.

score 0 · Answer 3 · answered Nov 18 '13 at 12:21

0

Try this code please :

           var x;

$.ajax({
    url: 'http://gdata.youtube.com/feeds/api/videos/' + code,
    type: 'get',
    dataType: 'json',
    success: function(data) { 
       x = 0;
       console.log('Result 1: ');
       console.log(data.responseText);
    },
    error: function(e) {
        var text = e.responseText;

        parser = new DOMParser();
        xmlDoc = parser.parseFromString(text, "text/xml");

        var titleXml = xmlDoc.getElementsByTagName('title')[0];
        var contentXml = xmlDoc.getElementsByTagName('content')[0];

        title = titleXml.childNodes[0];
        content = contentXml.childNodes[0];

        x = title;

    }
});

alert(x);

What is your error ?

answered Nov 18 '13 at 12:21

Vahid Taghizadeh

997
8
9

0, of course - this is asynchronous. – Ian Nov 18 '13 at 12:23
1

@Ian wrong, the alert will state `undefined`. – Christoph Nov 18 '13 at 12:31
Doh, read it too fast @Christoph. You're right. +1 for the spot. – Ian Nov 18 '13 at 12:33

Javascript alert value after ajax request

3 Answers3