Question

我有一个MVC视图，通过单击提交按钮，它使用Ajax将数据发布到Controller。控制器返回作为消息的json结果，并在View上显示它们。问题是，当我点击提交按钮它工作正常，但当我再次显示谢谢页面后按Enter键它发布到控制器方法并显示一个页面与json数据如下:(我需要使Enter工作作为推动也提交）

 {"status":"success","message":""}

这是我的观点：

     @using (Html.BeginForm("forgotPassword", "Home", FormMethod.Post))
        {
            @Html.AntiForgeryToken()
            <div>
                <div>Email Address</div>
                <div><input type="email" name="email" placeholder="example@email.com" id="email" class="forgot-password-textbox"></div>
                <div><label id="Message" class="forgot-password-error-message"></label></div>
                <div><input type="button" value="Submit" id="btn-reset-password" onclick="resetPasswordHandler()" class="orange-button forgot-password-button"></div>
            </div>
        }

这是我的控制器方法：

    [HttpPost]
    [Route("forgotPassword")]
    public async Task<JsonResult> ForgotPassword(ForgotPasswordRequest forgotPasswordRequest)
    {
        ...
        try
        {
            if (ModelState.IsValid)
            {
                if (!string.IsNullOrEmpty(forgotPasswordRequest.Email))
                {
                    users = await authenticationService.GetUserByEmailAsync(forgotPasswordRequest.Email);
                    if (users.Any())
                    {
                        if(users.FirstOrDefault().StatusId == 2)
                        {
                            return Json(new { status = "error", message = Constants.MessageStrings.ForgotPasswordDisabledUser });
                        }
                        //New User without creating password
                        if (string.IsNullOrEmpty(users.FirstOrDefault().PasswordHash))
                        {                            
                                return Json(new { status = "error", message = Constants.MessageStrings.ForgotPasswordDisabledUser });
                        }
                        ....
                        }
                    }
                    else
                    {
                        ModelState.AddModelError("", Constants.MessageStrings.NoUser);
                        return Json(new { status = "error", message = Constants.MessageStrings.NoUser });
                    }
                }
            }
            else
            {
                .......
        return Json(new { status = "error", message = Constants.MessageStrings.RequiredFields });
    }

这是我调用控制器的Ajax：

function resetPasswordHandler() {
var postResult = null;
var data = {
    Email: document.getElementById('email').value
};
var path = "/forgotPassword";

var errorMessage = document.getElementById('Message');

$.ajax({
    dataType: "text",
    url: path,
    data: data,
    type: "POST",
    cache: false,
    success: function (result) {
        postResult = $.parseJSON(result);
        if (postResult.status == "success") {
            $('#forgot').hide();
            $('#forgot-thank-you').show();
            return false;
        }
        else {
            errorMessage.innerHTML = postResult.message;
        }
    },
    error: function () {
        errorMessage.innerHTML = "An error occured";
    }
});
return false;
};


window.onkeydown = function () {
   if (window.event.keyCode == '13') {
     resetPasswordHandler();
     }
   }

Answer 1

我会从按钮中删除点击处理程序，并处理相关表单的提交事件。

您应该提供ID以便更轻松地定位

function resetPasswordHandler(event) {
  var postResult = null,
      data = {
        Email: $('#email').val()
      },
      path = "/forgotPassword",
      errorMessage = $('#Message');

  event.preventDefault();

  $.ajax({
    dataType: "text",
    url: path,
    data: data,
    type: "POST",
    cache: false,
    success: function(result) {
      postResult = $.parseJSON(result);
      if (postResult.status == "success") {
        $('#forgot').hide();
        $('#forgot-thank-you').show();
        return;
      } else {
        errorMessage.html(postResult.message);
      }
    },
    error: function() {
      errorMessage.html("An error occured");
    }
  });
  return false;
};

$('#reset-form').on('submit', resetPasswordHandler);

并简化您的脚本（，因为您使用的是jQuery ）

＆＃13;

{{1}}

＆＃13;

Answer 2

return Json(new { status="success",message="what ever your msg"}, JsonRequestBehavior.AllowGet);

按Enter后显示Json Data而不是Click ob submit

2 个答案: