Home / Questions / 21472
Accepted
Antonio
Asked: 2020-08-24 14:17:24 +0800 CST 2020-08-24 14:17:24 +0800 CST

级联下拉列表

  • 772

我有这段代码，但是当我更改第一个选项时DropDownList ，出现以下错误：

在第二个 DropDownList 中未定义

 -El controlador-
public JsonResult ArticulosPorCategoria(int Id )
{
      var articulos = db.articulo.ToList().Where(p => p.Id_Categoria == Id);
      return Json(articulos, JsonRequestBehavior.AllowGet); 
}
    <script type="text/javascript">
        $(function () {
            $("#Categoria").change(function () {
                var val = $(this).val();
                var subItems="";
                $.getJSON("@Url.Action("ArticulosPorCategoria","Ventas")", {id:val} ,function (data){
                  $.each(data,function(index,item){
                    subItems+="<option value='"+item.Value+"'>"+item.Text+"</option>"
                  });
                  $("#Articulo").html(subItems)
                });
            });
        });
    </script>

@Html.DropDownList("Categoria", ViewBag.Categoria as SelectList, 
htmlAttributes: new { @class = "form-control" })

@Html.DropDownList("Articulo", ViewBag.Artics as SelectList, 
htmlAttributes: new { @class = "form-control" })

它是这样出来的：
这就是我的结果

asp.net-mvc

1 Answers

  1. Best Answer

    我已经解决了，以防将来有人需要类似的东西

    控制器

    public JsonResult ArticulosPorCategoria(int Id )
{
    var articulos = db.articulo.ToList().Where(p => p.Id_Categoria == Id);
    return Json(new SelectList(articulos, "Id", "Nombre")); 
}

    脚本

    <script type="text/javascript">

    $(document).ready(function () {
        $("#Categoria").change(function () {
            $("#Articulo").empty();
            $.ajax({
                type: 'POST',
                url: '@Url.Action("ArticulosPorCategoria")',
                dataType: 'json',
                data: { id: $("#Categoria").val() },
                success: function (articulos) {
                    $.each(articulos, function (i, articulo) {
                        $("#Articulo").append('<option value="' + articulo.Value + '">' +  
                        articulo.Text + '</option>');   

                    });
                },
            })
        });
    });
</script>

    @Html.DropDownList("Categoria", ViewBag.Categoria as SelectList,htmlAttributes: new { @class = "form-control" })

@Html.DropDownList("Articulo", ViewBag.Artics as SelectList,htmlAttributes: new { @class = "form-control" })
    • 6