ASP CORE Razor页面，带有下拉列表的可变Viewbag过滤器内容

Question

我有三个下拉列表，其中填充了viewbag变量的内容。当我使用JQuery或javascript选择第一个变量的值时，我希望第二个变量的内容被过滤。与第三个下拉列表相同，该列表由第二个中选择的内容过滤。

 <script type="text/javascript">

        function SelectedIndexChanged(accion, idnum) {
            var nuevaSelProyecto = "";
            var proyecto = "";
            var nombre = "";
            switch (idnum) {
                case "ddlSelContrato": {
                    //var getValue = document.getElementById('ddlSelContrato').selectedOptions[0].value;
                    var e = document.getElementById("ddlSelContrato");
                    var getValue = e.options[e.selectedIndex].value;
                    nombre = "Contrato, indice seleccionado: " + getValue;
                };
                    break;
                case "ddlSelProyecto":
                    nombre = "Proyecto";
                    break;
                case "ddlPtoStudio":
                    nombre = "Punto Estudio";
                default:
                    nombre = "Defecto";
                    break;
            }
            alert("Alerta, indice: " + accion + " - " + nombre);
        }

    </script>
    <div>
        <text style="margin-left: 8px;">
            &nbsp   Contrato &nbsp
        </text>
        @*--------------------Listado desplegable de Contrato--------------------------*@
        @Html.DropDownList("ddlSelContrato", new SelectList(ViewBag.SelContrato, "Id", "Nombre"), new { Class = "ddlStyle", onchange = "SelectedIndexChanged(this.value ,id)" })

    </div>

    <div>
        <text style="margin-left: 8px;">
            &nbsp   Proyecto &nbsp
        </text>
        @*--------------------Listado desplegable de Proyecto--------------------------*@
        @Html.DropDownList("ddlSelProyecto", new SelectList(ViewBag.SelProyecto, "Id", "Nombre"), new { Class = "ddlStyle", onchange = "SelectedIndexChanged(this.value ,id)"})
    </div>
    <div>
        <text style="margin-left: 8px;">
            &nbsp   Punto de Medicion &nbsp
        </text>
        @*--------------------Listado desplegable de Puntos de estudio--------------------------*@
        @Html.DropDownList("ddlPtoStudio", new SelectList(ViewBag.PtoStudio, "Id", "Nombre"), new { Class = "ddlStyle", onchange = "SelectedIndexChanged(this.value ,id)" })
    </div>

控制器：

       // GET: PuntoEstudios
    public IActionResult Index()
    {
        ViewBag.SelContrato = _context.Contratos.OrderByDescending(x=>x.Nombre).ToList(); //Variable MVC donde paso a la vista el List de los Contratos
        ViewBag.SelProyecto = _context.Proyectos.ToList(); //Variable MVC donde paso a la vista el List de los Proyectos
        ViewBag.PtoStudio = _context.PuntoEstudios.ToList(); //Variable MVC donde paso a la vista el List de los pto de estudio

        return View();
    }

如何不调用服务器就可以做到这一点>

我有三个下拉列表，其中填充了viewbag变量的内容。当我使用JQuery或javascript选择第一个变量的值时，我希望第二个变量的内容被过滤。 ...

Answer 1

我假设您的三个模型之间的关系类似：Contrato-Proyecto（一对多），Proyecto-PtoStudio（一对多）。如果要在不调用服务器的情况下更改dropdownlist的过滤器值，则可以参考以下工作演示：