Question

我的页面上有一个下拉列表，显示班级中硬编码的数据。

我有以下类叫做状态：

public class State
{
    public string StateCode {get; set;}
    public string StateName { get; set; }

    public static IQueryable<State> GetStates()
    {
        return new List<State>
        {
            new State{
                StateCode="DE",
                StateName="Delaware"
            },
            new State{
                StateCode="NJ",
                StateName="New Jersey"
            },
            new State{
                StateCode="PA",
                StateName="Pennsylvania"
            }

        }.AsQueryable();
    }
}

我的家庭控制器有以下行动：

public ActionResult Index()
    {
        return View();
    }

    public ActionResult StateList()
    {
        IQueryable states = State.GetStates();
        if (HttpContext.Request.IsAjaxRequest())
        {
            return Json(new SelectList(states,
                "StateCode",
                "StateCode"), JsonRequestBehavior.AllowGet
                );
       }
        return View(states);
    }

以下是我的看法：

@section scripts {
<script type="text/javascript">
$(function () {
    $.getJSON("/Home/States/List", function (data) {
        var items = "<option>Please Select</option>"
        $.each(data, function (i, state) {
            items += "<option value='" + state.Value + "'>" + state.Text + "</option>";
        });
        $("States").html(items);
    });


});

</script>
}

@using (Html.BeginForm())
{

<label for="States"></label>
<br />
<select id="States" name="States"></select>

}

我还将此添加到我的路由中：

routes.MapRoute(
            "StatesList",
            "Home/States/List",
            new { controller = "Home", action = "StateList" }
        );

我没有收到任何错误，但我的下拉框中也没有显示任何数据。我尝试调试我的控制器，我可以看到状态数据进入操作内的对象状态。任何人都可以帮我诊断问题吗？

Answer 1

$("States").html(items);必须为$("#States").html(items);（哈希表示jQuery ID Selector）

附注：

IQueryable GetStates（）应该是IEnumerable GetStates（）（参考链接文档）
创建SelectList无需额外开销在StateList()方法中。它可以只是return Json(states, JsonRequestBehavior.AllowGet);然后在ajax success中功能：items += "<option value='" + state.StateCode + "'>" + state.StateName + "</option>";
目前，如果选择了第一个选项（“请选择”），它将会回发值Please Select，我怀疑这不是你的意思想。 Intead，为选项提供null值（然后您可以使用它）与[Required]属性一起强制选择）。例如：var items = $('<option>Please Select</option>').val('');

无法使用MVC在下拉列表中显示数据

1 个答案: