ajax - Await is not working inside a method javascript

Question

I have an ajax call which return some data. Code is:

function ProductCodeLookUp() {
        return $.ajax({
            url: "/ProductInventory/GetProductCodeHirerchy",
            type: "get", //send it through get method
            async: false,
            data: {
                productCode: $('#ProductCodeText_Id').val()
            },
            success: function (response) {
                debugger;
                if (response != null && (response.tissueClassificationType != null || response.tissueClassificationType != null)) {
                    $('#productCodeTable_id').show();
                    $('#ProductCodeNotExistsWarning_id').hide();

                    //addOptionsToSelect(response, 'size_id', $('input[id=size_id]').val());
                    $('#ProductCodeTextClassification_Id').text(response.tissueClassificationType);
                    $('#ProductCodeTextTissueType_Id').text(response.tissueType);
                    $('#ProductCodeTextProduct_Id').text(response.tissueDefinition);
                    $('#ProductCodeTextSize_Id').text(response.tissueDefinitionSize);
                }
                else {
                    $('#ProductCodeNotExistsWarning_id').show();
                    $('#productCodeTable_id').hide();
                }
            },
            error: function (xhr) {
                //Do Something to handle error
            }
        });
    }

I Have to take some decision on the basis of the data returned by this Ajax call. The method where i am calling ProductCodeLookUp() method is:

async function checkRequiredFields() {
var isValid = false;
if (checkRequiredFieldsSubMethod() == true) {
            if (AddProductInBulk() == true) {
                if (QualityChecksValidation() == true) {
                    debugger;
                    var res = await ProductCodeLookUp();
                    if (res.tissueDefinitionSize != null)
                        isValid = true;
                    else
                        isValid = false;
                  }
                }
         }
        debugger;
        return isValid;
    }

Issue is that it does not await on the ProductCodeLookUp() method. I have to wait for the result of this method and on the basis of result make a decision that whether to return true or false. But i am unable to do this. What can be the possible issue.

question from:https://stackoverflow.com/questions/65950584/await-is-not-working-inside-a-method-javascript

Answer 1

Wrap the ajax call in a promise that resolves on success and rejects on error.

function ProductCodeLookUp() {
  return new Promise((resolve, reject) => $.ajax({
    // ...
    success: function (response) {
      // ...
      resolve();
    },
    error: function (response, status, err) {
       // ...
       reject(err);
    }
  }));
}   

Also, set async to true