Question

嗨，在一个按日期输入更改事件调用的函数中进行了ajax调用，以检查用户是否已经使用了日期。点击功能完成后，Ajax调用成功。

如何获取成功结果，并继续执行#datepicker更改功能，因为我需要json结果来完成其余功能。

控制器

public ActionResult IsDateAvailable(DateTime date, int Id) {

  var dateAvailable = !(_context.Trading.Any(t => t.uId == Id && t.TradingDate == date));

  if (!(dateAvailable)) {
    return Json(new {
      status = false, msg = "This date already exists."
    });
  }

  return Json(new {
    status = true
  });
}

JavaScript

$(document).ready(function() {
  var message;
  var isDateValid;

  function CheckDate(para) {
    var dateValid;
    var mesg;

    return $.ajax({
      url: '@Url.Action("IsDateAvailable", "Trading")',
      type: "GET",
      data: para,
      dataType: "json",
      success: function(data) {
        if (!(data.status)) {
          message = data.msg;
        } else {
          isDateValid = true;
        }
      },
      error: function(xhr, httpStatusMessage) {
        alert(xhr + httpStatusMessage);
      }
    });
  }

  $("#datePicker").change(function() {
    $("#alert").css({
      'display': 'none'
    });

    if (Id == 0) {
      $("#alert").attr('class', 'alert alert-danger');
      $("#alert").text('Please select a User.');
      $("#alert").show();

      return false;
    }

    var date = $(this).val();

    var para = {
      date: date,
      Id: Id
    };
    CheckDate(para);

    if (isDateValid) {
      $("#btnAdd").show();
    } else {
      $("#btnAdd").css({
        'display': 'none'
      });
      $("#alert").attr('class', 'alert alert-danger');
      $("#alert").text(message);
      $("#alert").show();
    }

  });
});

Answer 1

您应该转向异步。更改代码以使其符合以下条件：

.
.
.
function CheckDate(para) {
    return new Promise((resolve, reject) => {
        return $.ajax({
            url: '@Url.Action("IsDateAvailable", "Trading")',
            type: "GET",
            data: para,
            dataType: "json",
            success: function(data) {
                if (!(data.status)) {
                    message = data.msg;
                } else {
                    isDateValid = true;
                }
                resolve();
            },
            error: function(xhr, httpStatusMessage) {
                alert(xhr + httpStatusMessage);
                reject();
        }
    });
}
.
.
.
checkDate(para).then(res => {
    if (isDateValid) {
      $("#btnAdd").show();
    } else {
      $("#btnAdd").css({
        'display': 'none'
      });
      $("#alert").attr('class', 'alert alert-danger');
      $("#alert").text(message);
      $("#alert").show();
    }
}).catch(err => { /* do something */ });

Answer 2

您只需要在ajax请求中设置async: false。您也可以从CheckDate中删除return这个词，因为它是多余的：

function CheckDate(para) {
var dateValid;
var mesg;

$.ajax({
  url: '@Url.Action("IsDateAvailable", "Trading")',
  async: false, 
  type: "GET",
  data: para,
  dataType: "json",
  success: function(data) {
    if (!(data.status)) {
      message = data.msg;
    } else {
      isDateValid = true;
    }
  },
  error: function(xhr, httpStatusMessage) {
    alert(xhr + httpStatusMessage);
  }
});
}

函数调用后触发Ajax回调

2 个答案: