How to use returned AJAX data in a JS/jQuery function

Question

I have AJAX (I think) returning data from a server call.

function showCustomer(str) {
    var xmlhttp;
    if (str=="") {
        document.getElementById("txtHint").innerHTML="";
        return;
    }

    if (window.XMLHttpRequest) { // code for IE7+, Firefox, Chrome, Opera, Safari
        xmlhttp = new XMLHttpRequest();
    }
    else { // code for IE6, IE5
        xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
    }

    xmlhttp.onreadystatechange = function() {
        if (xmlhttp.readyState == 4 && xmlhttp.status == 200) {
            document.getElementById("txtHint").innerHTML=xmlhttp.responseText;
        }
    }
    xmlhttp.open("GET", "getcustomer3.asp?q=" + str, true);
    xmlhttp.send();
}

The call returns this:

<script>var CC2=101;var CC4=105;</script>

The 101 & 105 are data from my DB.

I have a function in the page that the data is returned to. This is the function:

function unhideCC() {
    $("#" + CC2).show();
    $("#" + CC4).show();
}

I am calling the function from a button onClick event, and I wait to click said button until after the data has been returned, which I thought would work.

I am struggling to get the variables written back to the page to load into the function. I have a strong feeling I'm going about this in the entirely wrong way. Any pointers to get me on the correct path?

Thanks ahead of time!

EDIT: This is the code that returns the values:

response.write("<script>")
dim counter: counter = 0
do until rs.EOF
  for each x in rs.Fields
    counter = counter + 1
    'Use Mod() to check counter is even
    If counter Mod 2 = 0 Then response.write "var CC" & counter & "=" & x.value & ";"
  next
  rs.MoveNext
loop
response.write("")
response.write("</script>")

@ElliotM updated, sorry! Was trying to not bloat the question but I guess that is important info haha — Brett
– Brett, Commented May 16, 2014 at 14:42
It's important information because it shows us that you're doing this the way hard way! If you're using jquery, check out jquery.get — Jason
– Jason, Commented May 16, 2014 at 14:44
The reason I (and the below answer) suggest using jquery to make your ajax is because jquery parses your return value into native data "for free", otherwise you'll have to do the work to extract the values from your call return. — Jason
– Jason, Commented May 16, 2014 at 14:57

TchiYuan · Accepted Answer · 2014-05-16 14:52:58Z

2

First, can't your web server return json structure instead of :

<script>var CC2=101;var CC4=105;</script>

As json, it would look like this:

{
   "CC2" : 101,
   "CC4" : 105
}

It will then be much easier to access those variables. Or else you will need to parse your original data structure to extract the information or use eval(..) which is much more ugly.

With JQUERY your ajax call would look something like this:

$.ajax({
    type: "GET",
    url: "someurl",
    datatype: "json",
    data: ?,
    success: function(jsonServerData){

        var CC2 = jsonServerData.CC2;
        var CC4 = jsonServerData.CC4;

    },
    error: function(status, xht, err){
    }
});

refer to Jquery ajax documentation

edited May 16, 2014 at 14:52

answered May 16, 2014 at 14:47

TchiYuan

4,2985 gold badges32 silver badges36 bronze badges

Sign up to request clarification or add additional context in comments.

5 Comments

Brett Over a year ago

I added what the server call is in my question. Would it work if I just changed the response.write setups to return it in the format you listed?

TchiYuan Over a year ago

Is your server using ASP.NET? Almost every languages have built-in functions to convert your objects into a JSON string.

Jason Over a year ago

It won't work, because your ajax call doesn't automatically do anything with the return value to extract the data you want. If you re-write the ajax call using jquery as suggested here, it'll do exactly what you want.

Brett Over a year ago

@TchiYuan yes the server is using ASP.NET

TchiYuan Over a year ago

@Brett try this link to figure out how to return json from ASP.NET: johnnycode.com/2012/07/16/…

Collectives™ on Stack Overflow

How to use returned AJAX data in a JS/jQuery function

1 Answer 1

5 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

5 Comments

Your Answer

Sign up or log in

Post as a guest

Related