级联下拉列表MVC 3

时间:2011-12-27 00:37:21

标签: jquery asp.net-mvc asp.net-mvc-3 jquery-ui

我即将在MVC 3中创建级联下拉列表.Logik很简单,对于每个位置可能有很多Employees,因此我可以找出如何实现它的最佳方法是下拉列表。

我现在拥有的是:

填写1个列表以便与地点联系。在变化时,我可以将数据输入到我的员工列表的第二个,但我传输的数据是可记录日期“。

一旦我尝试发送带有ID和名字的员工,就不会发生任何事情。

控制器代码:

public ActionResult Months(string locId)
{
  var k = service.getEmployeeForLocation(Int32.Parse(locId))
                 .ToList()
                 .Select(x => new
                         {
                           Value = .EmployeeId,
                           Text = x.Name 
                         });

  return Json(k,JsonRequestBehavior.AllowGet); 
}

查看:

<tr>
<td>Choose your closest location : 
    @Html.DropDownListFor(x => x.SelectedLocation, Model.Locations)</td>
<td>Choose your closest location : 
    @Html.DropDownListFor(x => x.SelectedEmployee, 
                          Enumerable.Empty<SelectListItem>(), "-- select month --")
</tr>

的Javascript

</script>
<script type="text/javascript">
    $('#SelectedLocation').change(function () {
        var selectedLocation = $(this).val();
        if (selectedLocation != null && selectedLocation != '') {
            $.getJSON('@Url.Action("Months")', { locId: selectedLocation }, 
            function (employee) {

                var EmployeeSelect = $('#SelectedEmployee');
                //                monthsSelect.empty();

                $.each(employee, function (index, employee) {
                    EmployeeSelect.append($('<option/>', {
                        value: employee.value,
                        text: employee.text
                    }));
                });
            });

        }
    });
</script>

1 个答案:

答案 0 :(得分:2)

我可以看到的一件事是,您的操作中的变量名称以大写字母开头,JavaScript区分大小写。在您的页面中,您使用小写但如果您想将外壳保留在控制器中,则它们应为大写。