First off I was referring to many questions like this. But I didn't find suitable solutions. I have two functions one of which returns a boolean. I want to do something when I get the bool result of true. Problem with the following code is,

1. I see this alert first, alert("Please check the name, email and message. Make sure your email address is valid"); ---- (PostComment function)

2. Then I see this alert, alert(data.status); ---- (IsValidEmail function)

3. At the end I see this alert, alert("YES"); ---- (IsValidEmail function)

I want 2 and 3 to execute first, i.e. I want the result from IsValidEmail function in PostComment function before I do something. Please help.

 function IsValidEmail(emailAddress) {
            response = $.get("https://isitarealemail.com/api/email/validate?email="  
                emailAddress,
                function responseHandler(data) {
                    alert(data.status);  // 2
                    if (data.status === 'valid') {
                        alert("YES"); //3
                        return true;
                    } else {
                        return false;
                    }
                })
        }

        function PostComment() {
            var name = $("#name").val();
            var email = $("#email").val();
            var message = $("#message").val();
            var isValid = IsValidEmail(email);
            if (name == '' || email == '' || !isValid || message == '') {
                alert("Please check the name, email and message. Make sure your email address is valid"); //1
                $("#btnPostComment").prop('disabled', false);
                event.preventDefault();
                $("#preloader").hide();
                return;
            }
            $("#btnPostComment").prop('disabled', true);
            $("#Posting").show();
            var url = "/BlogData/PostComment";
            var formData = new FormData();
            formData.append("Name", name);
            formData.append("Email", email);
            formData.append("Comment", message);
            formData.append("BlogId", @Model.Id);

                $.ajax({
                    type: 'POST',
                    url: url,
                    data: formData,
                    processData: false,
                    contentType: false,
                    cache: false,
                    success: function (response) {
                        $("#preloader").show();
                        LoadPartialView(response.blogId);
                        $("#formPostComment")[0].reset();
                    },
                    failure: function (response) {
                        alert(response.responseText);
                        $("#preloader").hide();
                    },
                    error: function (response) {
                        alert(response.responseText);
                        $("#preloader").hide();
                    }
                });
            event.preventDefault();
        }

The PostComment function, I am calling as follows when the form is submitted.

 <form id="formPostComment" method="post" onsubmit="PostComment()">

CodePudding user response：

You are using asynchronous functions ($.get), which continues its execution with callback function, responseHandler in your case. And the returns in the responseHandler have no effect to the parent IsValidEmail function, in your case IsValidEmail returns void. To be able to return a value from function that calls some other asynchronous functions - you need to use promises.

function IsValidEmail(emailAddress) {
  return new Promise((resolve, reject) => {
    $.get(
      "https://isitarealemail.com/api/email/validate?email="   emailAddress,
      function responseHandler(data) {
        alert(data.status); // 2
        if (data.status === "valid") {
          alert("YES"); //3
          resolve(true);
        } else {
          resolve(false);
        }
      }
    );
  });
}

For you it will be easier to mark PostComment function as an async function and use await in it.

async function PostComment() {
  // ...

  const isValid = await IsValidEmail(email);

  // ...

}