how to read javascript variable from ajax success callback function

Question

I am doing

$.ajax({
    type: "GET",
    url: url, //valid url..The ajax part works fine
    dataType: 'html',
    success: function(response) {

        if (loginStatus !== 'false') {
            testFunction(response); //assuming there is a function called testFunction
        }
    }
});

The response is a mixed content of html and it also contains

<script>var loginStatus = 'false'</script>

if(loginStatus !== 'false') does not work in the success. What am I doing wrong?

The response looks like this

<!DOCTYPE html>
<html>
<head>
<title>Title of the document</title>
</head>

<body>
This is a test page
<script>var loginStatus = 'false'</script>
</body>

</html>

loginStatus !== 'false' it means false !== false` ? it will never do your condition — Jack jdeoel
– Jack jdeoel, Commented May 12, 2016 at 3:47
@DavidJawphan-- that boolean gets set dynamically. So yes the idea is to evaluate that variable. If false dont call that method. — soum
– soum, Commented May 12, 2016 at 3:54

Community · Accepted Answer · 2017-05-23 12:07:55Z

The solution is not pretty. This would be much easier if the response was JSON. Why can't I parse a Ajax html GET response in jQuery? provides hints to a potential solution.

You will have to parse the HTML that gets returned. The bad part is that the Javascript part will have to be evald (bad practice!) unless you do some regular expression magic get the value of the variable.

UPDATE (DON'T DO THIS):

Again, disclaimer, this is bad practice, but it's possible. The following is just a proof of concept applied to your code. There is also a JSFiddle with the basic idea. Basically, you parse the response with JQuery's .parseHTML method and evaluate the script with .globalEval at which point the variable becomes available to check.

$.ajax({
  type: "GET",
  url: url, //valid url..The ajax part works fine
  dataType: 'html',
  success: function(response) {
    var scriptContent = $($.parseHTML(response, document, true)).filter('script').text();
    $.globalEval(scriptContent);
    // at this point, the variable loginStatus should be defined

    if (loginStatus !== 'false') {
        testFunction(response); //assuming there is a function called testFunction
    }
  }
});

Another reference: jQuery - script tags in the HTML are parsed out by jQuery and not executed

yeah I wish I could though. I agree that would be a better solution
I update the answer with what I think is an example that could work. Let me know if that helps.
I ended up listening to your first advise of not relying on eval and parsed that boolean as html like <span display="none" class="loginStatus">false</span>...then it became easy enough to do $(response).find('. loginStatus').html()..which worked

leofukui · Accepted Answer · 2016-05-12 04:04:43Z

1

I think you can't access a variable inside ajax return because its javascript is not interpreted.

It's not a good idea (and you could have others problems) but you can put the return to some hidden iframe and access the variable inside using something like:

document.getElementById("iframeId").contentWindow.loginStatus

If you have control of the page that you are retrieving the ajax result, I recommend you to response only the variable content or a json to manipulate easily in your javascript.

edited May 12, 2016 at 4:04

answered May 12, 2016 at 3:58

leofukui

274 bronze badges

Comments

Eldhose Elias · Accepted Answer · 2016-05-12 03:59:56Z

$.ajax({
    type: "GET",
    url: 'loginCheck.php', //valid url..The ajax part works fine
    dataType: 'html',
    success: function(response) {
        if (response == "YES") {
         testFunction(response); //assuming there is a function called testFunction
        }
    }
});

loginCheck.php

// check the username and password if it matches with the username and password in the database . then echo "YES" otherwise echo "NO"
i explained this login concept using PHP scripting language.

Collectives™ on Stack Overflow

how to read javascript variable from ajax success callback function

3 Answers 3

3 Comments

Comments

loginCheck.php

Comments

Linked

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

3 Comments

Comments

loginCheck.php

Comments

Linked

Related