Return boolean value from Jquery ajax call to WebService

Question

0.00/5 (No votes)

See more:

I have a page in which i have loaded an external js file which has the following code which gets called from the same page where it is loaded into sort of a template code for checking user authority.

This is the code from the external js file Template code

JavaScript

function UserAuthorityCheck(){
        var returnData = $.ajax({
        async: true,
        type: "POST",
        url: "http://localhost:80/myApp/MyWebService.asmx" + "/" + "MyUserInRole",
        contentType: "application/json; charset=utf-8",
        dataType: "json"
    });

    returnData.then(success, error);
}

function success(response) {
    if (response.d == 'success') {
        return true;
    }
    else {
        return false;
    }
}

function error(response) {
    return false;
}

The page also contains this code which calls the above code

JavaScript

$(document).ready(function () {
   $(window).load(function () {                
     var response = UserAuthorityCheck();
                
     if (response != undefined || response != null) {
        isUserAuthority(response);
     }

     function isUserAuthority(response) {
       if (response == true) {
          var element = $(document).find('input#btnsearch');
          element.prop('disabled', false);      
       }
       else {
          var element = $(document).find('input#btnsearch');
          element.prop('disabled', true);
       }
     }
   });
 });

How do i get the return value from the ajax on success.
it always returns undefined to the var response variable as it is asynchronous call to ajax so the invoking code continues it execution.

Kindly advise anybody.
Thanks in advance.

Posted 8-Dec-15 1:42am

Christopher Fernandes

Add a Solution

Comments

ZurdoDev 8-Dec-15 8:02am

I'm not familiar with returnData.then() so I have no idea if that is actually doing anything. However, the .ajax() call has a success property to where you can pass the function. See http://api.jquery.com/jQuery.ajax/

Richard Deeming 8-Dec-15 9:09am

.then() is a Promise method added in jQuery 1.8, which combines both the .done() and .fail() methods. It's mentioned in the remarks on the .ajax() method you linked to.

The remarks also say that the .success() callback is deprecated as of v1.8, and that you should use the Promise methods instead.

ZurdoDev 8-Dec-15 9:14am

Thanks.

ZurdoDev 8-Dec-15 9:17am

I did try to upgrade once and too many of our plugins (we don't even have that many) broke so we're still back in 1.4 or something.

F-ES Sitecore 8-Dec-15 9:32am

Aren't open source frameworks great :)

Christopher Fernandes 8-Dec-15 9:34am

Are you talking about jQuery or suggesting some other library which can be used as an alternative

Christopher Fernandes 8-Dec-15 9:34am

jQuery is Awesome:)

F-ES Sitecore 8-Dec-15 9:39am

It is but they literally don't care about compatibility or breaking changes. People might complain about Microsoft, but at least their stuff works :)

3 solutions

Add a Solution

Add your solution here

Treat my content as plain text, not as HTML

Preview 0

…

Existing Members

Sign in to your account

...or Join us

Download, Vote, Comment, Publish.

Your Email
Password
Forgot your password?

Your Email
This email is in use. Do you need your password?
Optional Password

I have read and agree to the Terms of Service and Privacy Policy
Please subscribe me to the CodeProject newsletters

When answering a question please:

Read the question carefully.
Understand that English isn't everyone's first language so be lenient of bad spelling and grammar.
If a question is poorly phrased then either ask for clarification, ignore it, or edit the question and fix the problem. Insults are not welcome.
Don't tell someone to read the manual. Chances are they have and don't get it. Provide an answer or move on to the next question.

Let's work to help developers, not make them feel stupid.

This content, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)

ZurdoDev · Accepted Answer · 2015-12-08T03:16:00

Solution 1

I read your question better this time and the problem you are asking about is asynchronous. What you have to do is change your structure of code. You can't call the UserAuthorityCheck() function and wait for a return value. You have to move the code after the call to UserAuthorityCheck() into the success function or have the success function call a new function that has the rest of the code.

Posted 8-Dec-15 3:16am

ZurdoDev

Comments

Christopher Fernandes 8-Dec-15 9:25am

the code works fine when I set async:false. but thats what i dont want as about 90+ thousand users currently hit the webapp.

ZurdoDev 8-Dec-15 9:28am

async false is also deprecated so you don't want to do that anyway. It's not supported by chrome anymore either, I believe.

F-ES Sitecore 8-Dec-15 9:37am

async false only affects the current user, but if the calls are slow due to activity then the browser will be unresponsive for longer. Anyway, as said you need to re-structure your code, it's the only way, that is the nature of asynch programming.

$(document).ready(function () {
$(window).load(function () {
UserAuthorityCheck();

// **** All this code needs moved to the Success\fail methods of the ajax call
if (response != undefined || response != null) {
isUserAuthority(response);
}

function isUserAuthority(response) {
if (response == true) {
var element = $(document).find('input#btnsearch');
element.prop('disabled', false);
}
else {
var element = $(document).find('input#btnsearch');
element.prop('disabled', true);
}
}
// *****
});
});

Richard Deeming · Accepted Answer · 2015-12-08T03:35:00

As Ryan said, you need to wait for the async call to complete. Something like this should work:

JavaScript

function UserAuthorityCheck(){
    var returnData = $.ajax({
        async: true,
        type: "POST",
        url: "http://localhost:80/myApp/MyWebService.asmx" + "/" + "MyUserInRole",
        contentType: "application/json; charset=utf-8",
        dataType: "json"
    });
 
    return returnData.then(function(response){ return response.d === 'success'; }, function(){ return false; });
}

$(document).ready(function () {
    var checkPromise = UserAuthorityCheck();
    checkPromise.then(isUserAuthority, function(){ isUserAuthority(false); });
    
    function isUserAuthority(response) {
        $('#btnsearch').prop('disabled', !response);
    }
});

Demo: https://jsfiddle.net/umd50vgv/[^]

Christopher Fernandes · Accepted Answer · 2015-12-08T03:32:00

It works fine when I modify the code as follows

JavaScript

function UserAuthorityCheck(){
        var bool = false; 
        $.ajax({
        async: false,
        type: "POST",
        url: "http://localhost:80/myApp/MyWebService.asmx" + "/" + "MyUserInRole",
        contentType: "application/json; charset=utf-8",
        dataType: "json",
        success: function (data) {
            if (data.d == 'success') {
                bool = true;
            }
            else {
                bool = false;
            }
        },
        error: function (data) {
            bool = false;
        },
        timeout: 20000
    });
    return bool;
}

JavaScript

$(document).ready(function () {               
  var response = UserAuthorityCheck();
                
  if (response != undefined || response != null) {
     isUserAuthority(response);
  }
 
  function isUserAuthority(response) {
    if (response == true) {
       var element = $(document).find('input#btnsearch');
       element.prop('disabled', false);      
    }
    else {
       var element = $(document).find('input#btnsearch');
       element.prop('disabled', true);
     }
   }
});

Return boolean value from Jquery ajax call to WebService

3 solutions

Solution 1

Solution 3

Solution 2

Add your solution here

Preview 0