How to access the response i get from POSTing with $.ajax

Question

I'm not a professional programmer and trying to pick this up from the web, so sorry in advance if my question seems stupid, but i've been spending the last 2 days researching this to no avail.

Here's my code:

function view(data)
{
    alert (data);
}

function test()
{
    var url = 'someurl';

    $.ajax({
        type: 'POST',
        url: url,
        async: false,
        contentType: "application/json",
        dataType: 'jsonp',
        data: "Basic=YWRtaW46cHNhZG0xbg==",
        headers: {
            "Basic": 'YWRtaW46cHNhZG0xbg=='
        },
        success: view(data)
    })
}

But whenever i run it, i get an error saying: "data is not defined". How do i access the actual response the request got? I believe that if you guys could give me a code that alerts the response (but uses my code) i can take it from there.

Thanks!!!

---

So Guys, first of all huge thanks for the fast and detailed response!

i tried both methods, and i didn't get an error for "undefined data", i guess what i don't understand is, what function am i calling?? and how come when i just want to put the "data" inside of a variable i need a function to proxy?

that being said, i've encounterd a new issue - for some reason FF/Chrome are ignoring the properties i've set and are sending it without the headers and as a "GET which is resulting in an error:

Request .com:xxxx?callback=jQuery191023387945420108736_1384464320088&        Basic=YWRtaW46cHNhZG0xbg==&_=1384464320089
Request Method:GET
Status Code:401 Unauthorized
Request Headersview source
Accept:*/*
Accept-Encoding:gzip,deflate,sdch
Accept-Language:en-US,en;q=0.8
Cache-Control:no-cache
Connection:keep-alive
Cookie:JSESSIONID=EC56CA6ADB540E1B6785B318DD0886CD
Host:IP:8083
Pragma:no-cache
User-Agent:Mozilla/5.0 (Windows NT 6.1; WOW64) AppleWebKit/537.36 (KHTML, like Gecko)     Chrome/30.0.1599.101 Safari/537.36
Query String Parametersview sourceview encoded
callback:jQuery191023387945420108736_1384464320088
Basic:YWRtaW46cHNhZG0xbg
_:1384464320089
Response Headersview source
Content-Length:77
Date:Wed, 13 Nov 2013 11:15:40 GMT
Secsph-Request-Id:1164775931060804669
Server:NA"

the main request is also accompanied by a secondary one which i'm not sure what invokes it or if it's related to the issue:

Request :nikkomsgchannel        /e?00160023002b00550046004b00660050005e005800280055005c007a002200590050004d004a005600520004002000530055003600210010005d005900540056000b006a003300500054002c0030005400470056001f0047004f00490023000f005b003000300042005c0056001f00550059004b002b000f0057002c002f005d005c00560050005f005a
Request Headersview source
Cache-Control:no-cache
Pragma:no-cache
User-Agent:Mozilla/5.0 (Windows NT 6.1; WOW64) AppleWebKit/537.36 (KHTML, like Gecko)     Chrome/30.0.1599.101 Safari/537.36
Query String Parametersview sourcevie encoded
00160023002b00550046004b00660050005e005800280055005c007a002200590050004d004a005600520004002000530055003600210010005d0

any thoughts?

Answer 1

Try:

function test() {
    var url = 'someurl';

    $.ajax({
        type: 'POST',
        url: url,
        async: false,
        contentType: "application/json",
        dataType: 'jsonp',
        data: "Basic=YWRtaW46cHNhZG0xbg==",
        headers: {
            Basic: 'YWRtaW46cHNhZG0xbg=='
        },
        success: function (data) {
            alert(JSON.stringify(data));
        }
    });
}

This seems to be what you're trying to do (alert the JSON string)

Answer 2

Try this..

function test() {
            var url = 'someurl';
            $.ajax({
                type: 'POST',
                url: url,
                async: false,
                contentType: "application/json",
                dataType: 'jsonp',
                data: "Basic=YWRtaW46cHNhZG0xbg==",
                headers: {
                    "Basic": 'YWRtaW46cHNhZG0xbg=='
                },
                success: function(data) {
                     console.log(data);
                     // /\ this will show on console the returned data.
                     //the variable 'data' actually contains the returned data.
                     // here you can do whatever you want with the returned data
                     //if you want to alert the response:
                     alert(data);
                }
           });
        }

Answer 3

When you do success: view(data) that executes view(data) immediately (attempting to pass data which doesn't currently exist to the view function), and attempts to set the returned value from that function as the success callback.

What you instead need to do is simply pass a function reference as the callback, so:

success: view

The view function will then be called when the AJAX request returns a successful response, and pass the response as the argument to the data parameter.