Question

我是MVC的新手，将现有的WPF应用程序转换为MVC网站。我们在应用程序多阶段下拉选择中使用的一个常见功能。我的意思是：

下拉列表A是数据库中的列表
选择A后，将根据该选择填充下拉列表
选择B后，将根据该选择填充Dropdown C

在WPF中，我可以创建一个自定义控件，可以轻松地将其放在我需要的任何地方，但我不确定MVC部分视图是否会给我我需要的功能，因为它似乎{ {3}}或putting javascript in a partial view is not recommended。我想对控制器执行ajax调用，以便在选中时为每个下拉列表加载数据，这需要javascript。

我抛出的一个想法是使用部分视图，使模型加载Dropdown A，然后在@Scripts.Render('multiDropdown.js'正下方Partial()。我不喜欢这个想法，因为我现在必须确保我还包括脚本，而不仅仅是渲染部分内容。我也不喜欢这个，因为如果有一些方法可以将javascript放入局部我也可以提供ViewData来提供要在javascript中使用的下拉列表ID，所以我可以有多个部分在同一页。如果javascript保持独立，我将不得不对部分和javascript中的元素进行硬编码。

我的另一个想法是使用@Ajax帮助程序尝试加载它们“没有”javascript，但我不确定是否，由于部分中的javascript限制，如果@Ajax方法也可以在部分视图中正常工作。

我可以使用其他技术来解决这个问题吗？这种过滤似乎是一种常见的功能，但我找不到任何可以帮助我实现它的资源，特别是以可重用的方式。

Answer 1

您需要搜索级联下拉列表，有大量示例如何执行此操作。您还需要使用AJAX来执行此操作。我将向您展示我的AJAX，让您朝着正确的方向前进。在这个AJAX调用的成功函数中，我正在清除Dropdown B的先前内容并重新填充服务器返回的内容。

               $.ajax({
                    url: "/Home/GetDivisions", //will return JsonResult
                    type: "GET",
                    data: { leagueId: value },
                    success: function (data) {

                        var ddlDivision = $('#ddlDivision'); 
                        ddlDivision.html(''); //clear previous contents.

                        $.each(data, function (index, item) {

                         ddlDivision.append($('<option></option>')
                        .val(item.Value)
                        .html(item.Text));
                        });
                     },

基于先前下拉列表的MVC过滤下拉，重用代码

1 个答案: