无法在 MVC4 Jquery 中绑定下拉菜单答案

【问题标题】：Unable to bind dropdown in MVC4 Jquery无法在 MVC4 Jquery 中绑定下拉菜单
【发布时间】：2016-10-17 05:30:39
【问题描述】：

我正在使用 jquery MVC4 绑定下拉列表。在控制器中，我得到了所有必需的值，但是当我在 jquery 成功调用中放置警报时，它显示为空。它显示[对象，对象]。这是我到目前为止所尝试的。

$.ajax({
    url: "@Url.Action("getrejectReason", "DocumentVerification")",
    dataType: "json",
    type: "POST",
    contentType: "application/json; charset=utf-8",
    error: function () {
        alert(" An error occurred.");
    },
    success: function (result) {
        alert(result);
        $.each(result, function (index, item) {
            options.append($("<option/>").val(item.value).text(item.text));
        });
    }
});

<select id="options"></select>

这是服务器端代码。

[HttpPost]
public JsonResult getrejectReason()
{
    DB_KYC3Entities db = new DB_KYC3Entities();
    var result = new SelectList(db.dbo_tm_rejectcomment, "Id", "RejectComment");
    return Json(result, JsonRequestBehavior.AllowGet);
}

有人可以告诉我我在这里做错了什么吗？谢谢

【问题讨论】：

不要使用alert()来调试代码。你的方法是发回一个序列化的SelectList，所以你的$.each()代码需要是$('#options').append($("<option/>").val(item.Value).text(item.Text));。
它应该像options.append($("<option>").val(item.Value).text(item.Text));，你必须先声明选项成功var options= $("#options");
但是还有其他多个问题 - 删除 contentType: "application/json; charset=utf-8", （您甚至没有发送任何内容，更不用说对其进行字符串化了。JsonRequestBehavior.AllowGet 是毫无意义的，因为您进行了 POST。您没有发回 SelectList - 发回你所需要的匿名对象。
谢谢你，我按你说的改了一切。我删除了内容类型。我在下面的行中收到错误，说缺少括号，但我有所有括号。 options.append($("
我更改如下 return Json(result);这是正确的吗？

标签： jquery asp.net-mvc asp.net-mvc-4

【解决方案1】：

您的控制器方法正在传回一个序列化的SelectList，其中包含属性Value 和Text（大写），因此要添加您需要引用相同属性（大写）的选项。

options.append($("<option/>").val(item.Value).text(item.Text));

但是，您的代码还有一些其他问题。

你没有在请求中发送任何数据，所以contentType: "application/json; charset=utf-8",是不必要的
您的方法标记为[HttpPost]，因此使用 JsonRequestBehavior.AllowGet 是不必要的
您应该只发回视图使用的数据（没有意义将SelectListItem 的附加属性发送回客户端，所以方法中的代码应该生成一个集合匿名对象
```
var model = db.dbo_tm_rejectcomment
    .Select(x => new { Value = x.Id, Text = x.RejectComment });
return Json(model);
```

但是您的 ajax 调用是不必要的，并且您有效地告诉客户 - 这是视图，但我忘记发送所有数据，所以请稍等片刻，然后再发出请求以获取它。您应该使用

生成您的视图

@Html.DropDownListFor(m => m.SelectedRejectReason, Model.RejectReasonList)

其中RejectReasonList 是您的视图模型中的属性IEnumerable<SelectListItem>

附带说明，不要使用alert() 进行调试。在脚本中添加debugger;（或设置断点），以便您可以单步执行脚本并检查变量。如果您确实想打印输出，请使用console.log()，这将允许您展开输出并查看数组中的实际对象。

【讨论】：