jQuery函数未在mvc文本更改事件中调用

时间:2018-11-27 06:53:20

标签: asp.net asp.net-mvc asp.net-mvc-4 asp.net-mvc-3

在使用mvc应用程序时,我在jQuery中遇到这种奇怪的行为。

下面是我实现了文字更改事件的MVC视图,

 @Html.TextBoxFor(m => m.UserId, new { @class = "form-control" })
                            @Html.ValidationMessageFor(m => m.UserId, "", new { @class = "text-danger" })

enter image description here

    $("#UserId").change(function () {
        var UserId = $(this).val();
        //$("#txtName").val(emailId);
        $.ajax({
            url: 'GetValidUserName',
            type: 'POST',
            data: JSON.stringify({ UserId: UserId }),
            dataType: 'json',
            contentType: 'application/json',
            success: function (data) {
                if (!$.trim(data)) {
                    alert("User does not exist in system. Please enter valid User Id.");
                    $(':input[type="submit"]').prop('disabled', true);
                }
                else {
                    $("#UserId").val(data);
                    $("#UserId").focus();
                    $(':input[type="submit"]').prop('disabled', false);
                }
            }
        });
    });

当我第一次直接加载Index视图时调试应用程序时,将调用jQuery函数并正确调用控制器操作。http://localhost:51012/UserApplication/Index

但是当我再次加载视图时,jQuery函数不会被调用。

控制器代码,

 public JsonResult GetValidUserName(string userId)
    {
        LMTUsage objLMT = new LMTUsage();
        LMTDAL objLMTDAL = new LMTDAL();

        string UserID = "";

        objLMT.UserList = objLMTDAL.GetAll_User("", 0, "6");

        var AllUsersInDatabase = from p in objLMT.UserList
                                 where p.UserId == userId
                                 select new
                                 {
                                     Name = p.UserName,
                                     Id = p.UserId,
                                 };

        foreach (var user in AllUsersInDatabase)
        {
            if (user.Name != null)
            {
                UserID = user.Id;
            }
        }
        return Json(UserID, JsonRequestBehavior.AllowGet);
    }

1 个答案:

答案 0 :(得分:0)

AJAX回调存在几个问题:

1)type: 'POST'选项需要[HttpPost]属性。如果该操作方法上没有该属性,请改用type: 'GET'

2)您不需要JSON.stringify()来传递包含简单类型(数字和字符串值)的单个参数。简单的{ userId: UserId }应该没问题。

3)控制器动作的参数名称必须与AJAX回调发送的参数名称完全匹配。

因此,您的AJAX回调应遵循以下示例:

$(function () {
    $("#UserId").change(function () {
        var UserId = $(this).val();

        $.ajax({
            url: '@Url.Action("GetValidUserName", "ControllerName")',
            type: 'GET',
            data: { userId: UserId },
            dataType: 'json',
            success: function (data) {
                if (!$.trim(data)) {
                    alert("User does not exist in system. Please enter valid User Id.");
                    $(':input[type="submit"]').prop('disabled', true);
                }
                else {
                    $("#UserId").val(data);
                    $("#UserId").focus();
                    $(':input[type="submit"]').prop('disabled', false);
                }
            }
        });
    });
});