Question

大家好，这是我在这里发表的第一篇帖子，如果我说些什么或做些蠢话，请保持温和：P这也是我在ASP.NET中的第一个真正的项目，我确信我在代码中犯了一些错误。

我正在开发一个ASP.NET MVC 5 Web应用程序，该应用程序具有3个DropDownLists，这些DropDownLists由数据库中的字符串填充。 3个列表是学期，课程和顾问名称。我希望能够根据所做的选择动态更改DropDownLists。

我目前所做的假设是选择第一学期，然后选择顾问名称。选择学期后，代码不会填充顾问名称。

在我理解了我的错误之后，我也希望能够在任何订单中选择3个选项中的任何一个。

这是我的控制器

 public ActionResult Index(string Semester1, string Course1, string Consultant1)
    {


        ViewBag.semester = new SelectList(db.StudentInfos.Select(x => x.semester).Distinct().OrderBy(x => x));
        ViewBag.course = new SelectList(db.StudentInfos.Select(x => x.WCOnlineCourse) .Distinct().OrderBy(x => x));
        ViewBag.consultant = new SelectList(db.StudentInfos.Select(x => x.consultant).Distinct().OrderBy(x => x));

        if (Semester1 != null)
        {

            ViewBag.course = new SelectList(db.StudentInfos.Where(x => x.semester == Semester1).Select(x => x.WCOnlineCourse).Distinct().OrderBy(x => x));

            ViewBag.consultant = new SelectList(db.StudentInfos.Where(x => x.semester == Semester1).Select(x => x.consultant).Distinct().OrderBy(x => x));


            if (Course1 != null)
            {
                ViewBag.consultant = new SelectList(db.StudentInfos.Where(x => x.semester == Semester1).Where(x => x.WCOnlineCourse == Course1).Select(x => x.consultant).Distinct().OrderBy(x => x));
            }

        }



        return View();
    }

这是我的观点

@model IEnumerable<StudentSurvey.Models.StudentInfo>

@{
    ViewBag.Title = "Index";
}

<h2>Index</h2>


<table class="table">
    <tr>

        <th>
            Semester
        </th>

        <th>
            Course
        </th>

        <th>
            Consultant
        </th>

    </tr>
    <tr>

        @using (Html.BeginForm("Index", "StudentInfos", FormMethod.Post))
        {
            <td>
                @Html.DropDownList("Semester1", (SelectList)ViewBag.semester, "Select Semester", new { onchange = "this.form.submit();" })
            </td>

            <td>
                @Html.DropDownList("Course1", (SelectList)ViewBag.course, "Select Course", new { onchange = "this.form.submit();" })
            </td>

            <td>
                @Html.DropDownList("Consultant1", (SelectList)ViewBag.consultant, "Select Consultant", new { onchange = "this.form.submit();" })
            </td>
        }


    </tr>

</table>

Answer 1

您正在寻找的是构建级联下拉列表。您需要实施某些内容以通过ajax加载数据，因为选择了下拉菜单，或者您需要执行回发（不推荐）。

请参阅this answer，或查看this post on codeproject的教程。

Answer 2

您可以使用jQuery，例如对于2选项，我们可以使用此代码：

$('#Cities').change(function () {                
               jQuery.getJSON('@Url.Action("SelectTown")', { id: $(this).val() }, function (data) {
                   $('#Towns').empty();
                   jQuery.each(data, function (i) {
                       var option = $('<option></option>').val(data[i].ID).text(data[i].Name);
                       $("#Towns").append(option);
                   });
               });
           });

对于像你的例子这样的3个选项我们可以使用这样的东西：

$(function (){
  $('#semester').change(function () {
    jQuery.getJSON('/Semester/GetCourse/', { id: $(this).attr('value') }, function (data) {
        jQuery.each(data, function (i) {
            var option = $('<option></option>').attr("value", data[i].Id).text(data[i].Title);
            $("#course").append(option);
        });
    });
    jQuery.getJSON('/Consultant/GetConsultant/', { id: $("#course").attr('value') }, function (man) {
        jQuery.each(man, function (i) {
            var option = $('<option></option>').attr("value", man[i].Id).text(man[i].Title);
            $("#mantaqeh").append(option);
        });
    });
  });
});

ASP.NET MVC 5使用3 DropDownList

2 个答案: