jquery - ASP MVC JsonResult 呈现为页面，而不是通过调用 jQuery 函数捕获

Question

我在从要在 jQuery 中处理的 ASP MVC Controller 方法获取 JSON 响应时遇到了一些问题 - 我之前已经尝试过没有问题 - 但这次我显然做错了一些事情，我可以不明白什么...

我有一个从 ASP MVC 3 渲染的 Spark View ，调用返回 JsonResult 的 Controller 方法。目前我已将其简化为仅显示成功或失败消息，直到它真正发挥作用。我可以在调试中通过两个路径跟踪该方法，并且创建的 JSON 对象看起来是正确的。

[HttpPost]
public JsonResult AdjustmentDetail(AdjustmentPaymentModel adjustment)
{
    try
    {
        //do some other processing
        return Json(new {success = true}, "application/json");
    }
    catch(Exception e)
    {
        return Json(new { success = false, message = e.Message });
    }
}

从 Spark View 调用 Controller 方法，使用 jQuery 提交表单并捕获结果，以向用户返回一些反馈，然后从那时起为他们提供一些选择。目前，它只是设置为弹出警报，以便我可以看到它接收 JSON 并执行回调函数。同样，为了可读性，表单上的一些输入已被删除(一个纯文本框和两个带有 jQ​​uery 日期选择器的文本框似乎运行正常 - 因此 javascript 中的日期选择器函数，我将其保留，以防它们可能会被删除。干扰)。

<script>
  $(document).ready(function () {
    $(".datepicker").attr('readOnly', 'true');
  });

  $(function () {
    $('.datepicker').datepicker({
      maxDate: 0,
      dateFormat: 'dd/mm/yy'
    });
  });

  $('document').ready(function () {
    $('#submit-adjustment').submit(function () {
      $('#mini-loader').show();

      $.post('${Url.Action("AdjustmentDetail", "payments")}', { adjustment: Model }, function (d) {
        alert(d);
        $('#mini-loader').hide();
      }, 'json');

      return false;
    });
  });
</script>

<form action='' id='submit-adjustment' method='post'>
  <label for="Notes">
    Notes
    <small>
      <span class="error">${Html.ValidationMessageFor(m => m.Notes)}</span>
    </small>
  </label>

  ${Html.EditorFor(m => m.Notes)}

  ${Html.HiddenFor(m => m.BankAccount)}
  ${Html.HiddenFor(m => m.IsCreditAdjustment)}

  <div style="padding-top:10px;">
    <input class="button big" name="submit-adjustment" type="submit" value="Submit Adjustment" />
    <img src="/Content/Images/mini-loader.gif" id="mini-loader" style="display: none;"/>
  </div>
</form>

在过去，上面的方法是有效的 - 表单发布，然后由 jQuery 回调函数处理生成的 JSON。然而在这种情况下(无论 Controller 方法成功完成还是抛出异常)，JSON 都会在浏览器中呈现:

{"success":true}

当在 Chrome 中执行 Javascript 时，该函数要么没有被调用，要么 JSON 渲染在有机会执行此操作之前正在更改页面。我已经使用 Fiddler 检查了调用，帖子的响应为 200，内容类型为:application/x-www-form-urlencoded

我已经在谷歌上搜索了一段时间，我要么无法在谷歌查询中表达问题，要么我只是在这里错过了一些非常简单的东西!非常感谢任何帮助 - 如果我需要提供更多详细信息，请告诉我。

Answer 1

将提交按钮更改为常规按钮

<input id="Button1" type="button" value="Test" class="btn btn-primary">

并添加要提交的jquery。

<script language="javascript" type="text/javascript">
$(document).ready(function () {


    $('#Button1').click(function () {
        alert('here');
        $('#addCustomerForm').submit();
        return false;
    });

});