JQuery ajax 在这里返回什么？

Question

我正在尝试编写一个 ajax 用户搜索。我有这个文本字段：

<input type="text" id="userSearch" class="search-query" placeholder="Search">

这个 jQuery 在 .js 文件中：

$("#userSearch").keyup(function () {
        if ($(this).val().length >= 3) {
            $.getJSON('/User/SearchUsers', { displayName: $(this).val() }, function (data) {
                if (data == null) {
                    alert("nothing");
                }
                else{
                    alert("OK");
                }
            });
        }
    });

这里是 UserController 和 Application 和 Repository 类：

[HttpGet]
public ActionResult SearchUsers(string displayName)
{
    return Json(userApp.GetUserBySearch(displayName), JsonRequestBehavior.AllowGet);
}

public List<User> GetUserBySearch(string displayName)
{
    return userRepo.GetUserBySearch(displayName);
}

public List<User> GetUserBySearch(string displayName)
{
    return context.Users.Include("Group").Where(u => u.DisplayName.Contains(displayName)).ToList();
}

但这根本不起作用。它根本没有警报。那是什么意思呢？这意味着数据为空而不是空？！ 我也试过这个：

var i = 0;
for (i = 0; i <= data.length; i++) {
    alert(data[i].UserId);
}

但它也不起作用。 我已经做了几千次这样的事情，但现在它不工作了...... 我该怎么办...？

Answer 1

我建议使用Fiddler 来测试浏览器和您的服务器之间发生的情况。

我还建议像这样使用 .ajax，它可以让您更加明确并捕获服务器上发生的错误：

var URL = 'yourURLGoesHere';
$.ajax({
    url: URL, type: "post", data: yourdata, dataType: 'json', contentType: "application/json",
    success: function (data, status, jqXHR) {
        console.log('status:', status);
        console.log('jqXHR:', jqXHR);
        console.log('data:', data);
        if (data) {
            //do your OK Stuff
        } else {
            //do your NOT OK Stuff
        }
    },
    error: function (data, status, jqXHR) {
        console.log('responseText:', data.responseText);
        //do your error stuff

    }
});

更新

看起来主要问题是您如何将数据发送到服务器。

如果您没有看到 500 错误的详细信息，则表明您正在使用 WebAPI 并且没有设置它来显示错误详细信息。如果是这种情况，这个link 可能会有所帮助。

这是使用 .ajax() 并将 displayName 放在查询字符串中的代码的更新版本 - 主要优点是您可以捕获错误事件并相应地处理它。

$("#userSearch").keyup(function () {
    if ($(this).val().length >= 3) {
        var URL = '/User/SearchUsers/?displayName=' + encodeURIComponent($(this).val());
        $.ajax({
            url: URL, type: "post", dataType: 'json', contentType: "application/json",
            success: function (data, status, jqXHR) {
                console.log('status:', status);
                console.log('jqXHR:', jqXHR);
                console.log('data:', data);
                if (data) {
                    //do your OK Stuff
                } else {
                    //do your NOT OK Stuff
                }
            },
            error: function (data, status, jqXHR) {
                console.log('responseText:', data.responseText);
                //do your error stuff

            }
        });
    }
});

Answer 2

将您的代码放入ready 事件中

$(document).ready(function(){
    $("#userSearch").keyup(function () {
        var value = $(this).val();    
        if (value.length >= 3) {
            $.getJSON('/User/SearchUsers', { displayName: value }, function (data) {
                if (data == null) {
                    alert("nothing");
                }
                else{
                    alert("OK");
                }
            });
        }
    });
});