Ajax calls hitting web server but no callback functions get executed

Question

The ajax function

function Verify(ccode,dgh)
{
    str = "ccode="+ccode+"&dgh="+dgh;
    console.log(str);//this outputs means that this functions gets called
    $.ajax({
        type: "POST",
        url: "ajax/verify",
        data: str,
        async: false,
        cache: false,
        error: function (xhr, ajaxOptions, thrownError)
        {
            console.log(xhr.status);
            console.log(thrownError);                         
        },
        success: function(json)
        {
            console.log("in-fun: "+json.code); //does not gets executed
            return json.code; //does not return value
        },
        failure:function(response)
        {
            console.log("Ajax call failed"); //does not executes
        }
    });
}

the above ajax function is called as var e = Verify(var1, var2); the value of e is undefined after the ajax request.

The ajax request does hit my web server and visible in apache logs and dev tools and returns 200 OK. Ajax endpoint is working and does returns a valid json. The page output header is also set to json

EDIT: updated the above code

function Verify(ccode,dgh)
{
    var retData = '';
    str = "ccode="+ccode+"&dgh="+dgh;
    console.log(str); // this works
    $.ajax({
        type: "POST",
        url: "ajax/verify",
        data: str,
        async: false,
        cache: false,
        error: function (xhr, ajaxOptions, thrownError)
        {
            console.log(xhr.status); //does not gets called
            console.log(thrownError);

        },
        success: function(json)
        {
            console.log("in-fun: "+json.code); //this does not ouputs anything
            retData = json.code;
        },
        complete:function(response)
        {
            console.log("Complete called"); //does not gets called
        }
    });
    return retData;
}

This function does not return anything, so the assignment uses `undefined` value — MaxZoom, Jul 10 '17 at 19:40
You are only returning a value from the callback functions, not the Verify function itself. — puelo, Jul 10 '17 at 19:43
Create a code variable or smth like that on top of your function that is empty. Assign your success value to that variable. Return the variable at the end of the function outside the ajax call. You may be suffering from callback scope hell. — ODelibalta, Jul 10 '17 at 19:45
Possible duplicate of [jquery - return value using ajax result on success](https://stackoverflow.com/questions/3302702/jquery-return-value-using-ajax-result-on-success) — MaxZoom, Jul 10 '17 at 19:51
Use return $.ajax and use like var ajaxObj = yourfunction; ajaxObj.success(function(response) { alert(response); }); ajax success is itself a callback so it wont return response until you use global var assign or return ajax object inside function.... Ha ha ha... :) — Nono, Jul 10 '17 at 19:55
Did you try what @ad_on_is suggested? On a sidenote: You shouldn't block the UI thread for a synchronous request, especially for a request to remote server. This leads to bad user expierence. — puelo, Jul 10 '17 at 19:58
What is your console output? Are you sure that the requests is successful? Check your Network-Tab and see if there any errors — puelo, Jul 10 '17 at 20:02
@puelo should'nt the `console.log()` be called in case of success but it does'nt — Pushkar, Jul 10 '17 at 20:03
There is no `failure` callback. Remove that and maybe add a for `complete` instead and check if this is getting called. You might already have a syntax error in your console about the `failure` callback. (http://api.jquery.com/jquery.ajax/) — puelo, Jul 10 '17 at 20:07
failure: doesn't exist in $.ajax() as far as I am aware. The console.log might not be working because you don't get an expected reply (that's why the error: function gets console.logged). Check if the response in your console is what you were expecting. I have a feeling this might have something to do with dataType. That is just a guess however. Documentation: http://api.jquery.com/jquery.ajax/ — Rob Monhemius, Jul 10 '17 at 20:15
@puelo yes it does and return 200 OK also apache logs does show a hit on the ajax page — Pushkar, Jul 10 '17 at 20:32
@puelo still no good. I think now i should directly populate `e` in ajax instead of calling `Verify()` — Pushkar, Jul 10 '17 at 20:47
Try to simplify and redo things step by step until you run into the mistake you made. If you do a console.log("error") and a console.log("success") one of them should trigger. Then check if you can output the value you want to retrieve from the server with a console.log(). If you can get that you should be good. If you can't you either have a coding error in the server-side code, you are sending the information in a wrong format or maybe the information you are looking for does not exist. You should be able to pinpoint where your issue comes from this way. Goodluck xD — Rob Monhemius, Jul 10 '17 at 21:14

MaxZoom · Accepted Answer · 2017-07-10T21:11:03.063

2

As the jQuery AJAX call is already used, you can rely on its deferred object as below:

function Verify(ccode, dgh)
{
  var str = "ccode="+ccode+"&dgh="+dgh;
  console.log(str);  //debug outputs
  return $.ajax({
      type: "POST",
      url: "ajax/verify",
      data: str
   });
}

Verify(var1, var2).done(function(json) {
  if (json) {
    var e = json.code;
    // more code for the success case
  }
  else {
    console.log("Invalid server response"); 
  }
}).fail(function() {
  console.log("Ajax call failed"); 
});

edited Jul 10 '17 at 21:11

answered Jul 10 '17 at 20:54

MaxZoom

7,619
5
28
44

Please notice that `done()` and `fail()` calls are outside the `Verify()` function, and use [jqXHR](http://api.jquery.com/Types/#jqXHR) object features. I agree that `e` has no true meaning except it is used in the success case. – MaxZoom Jul 10 '17 at 21:20

Ajax calls hitting web server but no callback functions get executed

1 Answers1