Question

我正在尝试根据第一个下拉列表中选择的内容创建一个级联下拉列表，但第二个列表仍然未定义。

以下是我的视图中的下拉列表：

      <td align="left">
            @Html.DropDownList("goals", ViewData["goals"] as SelectList, new { @class = "dropdownSource" })
            @Html.HiddenFor(model => model.budgetList[i].align_to_district_goal)
       <td align="left">
            @Html.DropDownList("priorities", new SelectList(string.Empty,"Value", "Text") , new { @class = "clsColumnNames" })
            @Html.HiddenFor(model => model.budgetList[i].align_to_district_priority)
       </td>

这是我的剧本：

<script>
    $("select.dropdownSource").live("change", (function () {
        $("#priorities").empty();

        var columnSelectBox = $(this).parent("td").next("td").find("select.clsColumnNames");

        $.ajax({
            type: 'POST',
            url: '/PrepareBudget/GetPriorities',
            dataType: 'json',
            data: { goals: $(this).find("option:selected").text() },
            success: function (str) {

                $.each(str, function (Value, Text) {
                    $("#priorities").append('<option value ="' + Text.Value + '">' + Text.Text + '</option>');
                    debugger;
                });
            },
            error: function (ex) {
                alert('Failed to retrieve columns.' + ex);
            }
        });
        return false;
    }));
</script>

这是我的控制器：

public JsonResult GetPriorities(string goals)
{
    List<string> priorities = new List<string>();

    switch (goals)
    {
        case "Goal 1: Strengthen Early Literacy":
            priorities.Add("Priority 1: Increase access to high-quality PreK classrooms and monitor quality");
            priorities.Add("Priority 2: Attract and retain strong teachers in early grades");
            priorities.Add("Priority 3: Execute a comprehensive District-wide literacy plan");
            priorities.Add("Priority 4: Leverage family and community partners to increase early literacy efforts");
            break;
        case "Goal 2: Improve Post-Secondary Readiness":
            priorities.Add("Priority 1: Improve student engagement through access to rigorous prep courses and personalized learning opportunities");
            break;
        case "Goal 3: Develop Teachers, Leaders, and Central Office to Drive Student Success":
            priorities.Add("Priority 1: Develop leadership pathways for teachers, coaches and school administrators");
            priorities.Add("Priority 2: Create competitive compensation systems to attract and retain classroom and school leaders");
            priorities.Add("Priority 3: Ensure high-quality feedback and evaluation of all staff connected to career development opportunities");
            priorities.Add("Priority 4: Use data deep dives in schools and District offices to drive continuous improvement");
            break;
        case "Goal 4: Expand High-Quality School Options":
            priorities.Add("Priority 1: Implement a common School Performance Framework to communicate school quality");
            priorities.Add("Priority 2: Transition to a student-based funding model");
            priorities.Add("Priority 3: Establish new school models that focus on different career training and specialized learning");
            priorities.Add("Priority 4: Commit to a compact with our charter schools");
            break;
        case "Goal 5: Mobilize Family and Community Partners":
            priorities.Add("Priority 1: Improve how we deliver information to parents through multiple communication avenues");
            priorities.Add("Priority 2: Provide ongoing diversity and customer service training to all staff and hold them accountable for service quality");
            priorities.Add("Priority 3: Establish a volunteer hub to connect partners to the District's student mission");
            break;
    }
    return Json(priorities);
}

为什么我在优先级下拉菜单中为每个优先级获取未定义？

Answer 1

//...
success: function (str) {
                $.each(str, function (index, text) {
                    $("#priorities").append('<option value ="' + index + '">' + text + '</option>');
                });
            },
///...

Answer 2

您的操作方法是返回字符串列表。列表中的每个项目（单个字符串对象）都没有Text或Value属性。但是您的客户端代码正试图访问这些代码。

您可以更改服务器方法以返回具有Text和Value属性的SelectListItem列表。

public JsonResult GetPriorities(string goals)
{
    List<SelectListItem> priorities = new List<SelectListItem>();
    // to do : Replace the below hard coded items with the real items you want
    priorities.Add(new SelectListItem { Value="Priority 1",
    Text="Priority1: Increase access to high-quality PreK classrooms and monitor quality"});

    return Json(priorities);
}

如果您正在从db表中读取优先级，最好将记录的Id的字符串化版本保留在Value属性

中

通过上述服务器代码更改，您当前的客户端代码将起作用。

另一个选项是更新您的客户端代码，以便按原样使用数组中的项目（单一字符串）。

这应该有用。

success: function (itemsArray) {
$.each(itemsArray, function (index, p) {

   $("#priorities").append('<option value ="' + p+ '">' + p+ '</option>');

});

我还注意到您的代码中存在另一个问题。从jQuery 1.7开始，jQuery live方法是deprecated。您应该考虑使用on而不是直播。

$(function(){

  $("select.dropdownSource").on("change", (function () {

  });

});

C＃级联DropDownList获取未定义

2 个答案: