Question

我有一个简单的密码重置表单，其中包含用户名字段，在其下方是安全问题的下拉列表。

我正在努力工作的是当用户输入有效的用户名时，当他们从文本框中取消焦点时，我想拥有它以便下拉列表将填充我的数据库中的用户安全问题

这是我的HTML

    <div class="editor-field">
        @Html.TextBoxFor(model => model.userName, new { @Id = "forgotPassUserName" })
        @Html.ValidationMessageFor(model => model.userName)
    </div>

    <div class="editor-field">
    @{
        List<SelectListItem> securityquestionvalues = new List<SelectListItem>();
    }
        @Html.DropDownListFor(model => model.securityQuestion, securityquestionvalues, new { @Id = "forgotPassSecurityQuestions" })

这是我的jQuery / JS

<script type="text/javascript">
$(function () {
    $("#forgotPassUserName").change(function () {
        var selectedValue = $(this).val();
        $.getJson("LoginRegisterController/ForgotPasswordDropDownList", { user: selectedValue }, function (result) {
            var selectList = $("#forgotPassSecurityQuestions");
            selectList.add(result, null);

        });
    });
});

以下是控制器中由上面的getJSON调用的方法：

        public ActionResult ForgotPasswordDropDownList(string userName)
    {
        var db = IoC.ResolveObjectContextelearningCommon();

        var rep = db.GetRepository<EmployeeReg>();

        List<EmployeeReg> user = rep.Find(o => o.Login == userName).ToList();

        List<SelectListItem> questionList = new List<SelectListItem>();

        if (user[0].secureQuestion1 != null)
        {
            questionList.Add(new SelectListItem { Text = user[0].secureQuestion1, Value = user[0].secureQuestion1 });
        }

        if (user[0].secureQuestion2 != null)
        {
            questionList.Add(new SelectListItem { Text = user[0].secureQuestion2, Value = user[0].secureQuestion2 });
        }

        return Json(questionList, JsonRequestBehavior.AllowGet);
    }

不幸的是。这不适合我。不幸的是，当我尝试在getJSON方法断点时，我得到了错误。问题似乎就在那里。

修改

我将我的getJSON方法更改为.ajax，如此

<script type="text/javascript">
$(function () {
    $("#forgotPassUserName").change(function () {
        var selectedValue = $(this).val();
        var url = '<%= Url.Action("ForgotPasswordDropDownList", "LoginRegisterController") %>';
        $.ajax({
            type: "GET",
            url: url,
            data: { userName: selectedValue },
            contentType: "application/json; charset=utf-8",
            dataType: "json",
            success: function (result) {
                alert("testing");
            }
        });
    });
});

仍然没有警告弹出窗口....

Answer 1

以下行不对：

selectList.add(result, null);

您需要一个for循环来将它们添加到选择列表中，例如：

selectList.html(""); //empty the options first

for (var i = 0; i < result.length; i++)
{
    selectList.append("<option value='" + result[i].Value  + "'>" 
        + result[i].Text  + "</option>");
}

Answer 2

在更改事件使用模糊事件上触发事件。

$("#forgotPassUserName").blur(

这将正确触发更改事件

根据文本框中的值自动填充下拉列表

2 个答案: