使用jQuery和MVC检查用户名可用性

Checking username availability with jQuery and MVC

本文关键字：用户 可用性 检查 MVC jQuery 使用      更新时间：2023-09-26

我有一个用户名文本框，我想检查当用户键入时它是否可用。我已经设置了jQuery如下:

$(document).ready(function () {
    $("#UserName_" + @Html.Raw(Json.Encode(Model.PersonId))).bind("keypress", function () {
        if($(this).val().length > 0) {
            $.ajax({
                url: "/Student/CheckUserName",
                type: "GET",
                data: { userName: $("#UserName_"  + @Html.Raw(Json.Encode(Model.PersonId))).val() },
                success: function (data, responseStatus, jQXHR) {
                    $("#WRAPPERDIVID_" + @Html.Raw(Json.Encode(Model.PersonId))).html(data);
                }
            });
        }
    });
});

和page up如下:

@Html.LabelFor(m => m.UserName, htmlAttributes: new { @class = "control-label col-md-2" })
<div class="col-xs-6 col-md-4">
    @Html.EditorFor(m => m.UserName, new { htmlAttributes = new { @class = "form-control", @id = "UserName_" + Model.PersonId } })
    <div id="WRAPPERDIVID_@Model.PersonId"></div>
</div>

控制器是这样的

 // GET: Student/CheckUserName
    public async Task<String> CheckUserName(String username)
    {
        var exists = await db.Students.Where(u => u.UserName == username).FirstOrDefaultAsync();
        if (exists == null) { return "That User Name is available!"; }
        return "That User Name is NOT available!";
    }

一切都很好——至少看起来是这样。我希望用户名至少为6个字符，所以我最初设置为开始检查5个字符后，但我看到奇怪的结果，所以我把它改为0。仍然得到奇怪的结果，我认为它必须绑定到"按键"事件，但我不确定。

它只会在用户输入第7个字符(字符或空格)后检查6个字符的密码。

所以，如果我输入一个不可用的密码，比如"candy4"，它不会告诉我它不可用，直到我输入像"candy45"这样的密码，它本身可能是可用的，但消息会说它不可用，因为它响应的是"candy4"不可用。

好吧，我是个白痴。我只是把"按键"改为"keyup"，它的工作原理就像我期望的那样。在我写这个问题的时候，我想这是有道理的——我想有时候这就是所有需要的!

相关文章：