javascript - 使用 Fluent nhibernate 的级联下拉列表 MVC5

Question

我已经阅读了两天，每个问题看起来都像我的问题，并阅读了多个页面和教程，甚至观看了视频，但我只是无法理解它或使其工作...... 我想做的是，我有两个下拉列表，一个是“Departamentos”，您可以将其视为一个州，另一个是“Municipios”，您可以将其视为一个县。我需要的是，无论什么我都无法使其工作，当我选择一个部门时，只有该部门的市政当局才会显示在下拉列表中。我真的是一个关于编程的菜鸟，不幸的是，我认为我从一些对我来说太大的东西开始，所以如果这对你来说是一件非常简单的基本事情，我很抱歉。

部门类别是:

public virtual int id_departamento { get; set; }
public virtual string descripcion { get; set; }      

    //i specify Relationship for fluent Nhibernate to municipios since it is a 1-n
    public virtual IList<Municipios> Municipios { get; set; }

市政类是:

public virtual int id_municipio { get; set; }
public virtual string municipio { get; set; }
public virtual int id_departamento { get; set; }//THis is the FK from Departamento

这是我的主类 Sitios，我将所有内容连接到: 这是针对 Nhibernate 关系的

public virtual Departamentos Departamento { get; set; }          
public virtual Municipios Municipios { get; set; }

这适用于同一 Sitios 类上的列表:

public virtual List<Departamentos> Departamentos { get; set; } 
public virtual List<Municipios> municipiosLista { get; set; }

现在转到 MVC，这是我用于 Get 创建的 Controller ，我在其中填充要显示的 Departamento 和 Municipio 列表:

using (ISession session = NhibernateHelper.OpenSession())
        {                
            var deptos = session.Query<Departamentos>().ToList();
            var munis = session.Query<Municipios>().ToList();                      

            var instanciadelacopia=new Sitios
            {
                Departamentos = deptos, 
                municipiosLista = munis                
            };
            return View(instanciadelacopia);            
            }

以及该特定下拉部分的创建 View :

@using (Html.BeginForm())
{
@Html.AntiForgeryToken()

<div class="form-horizontal">
    <h4>Sitios</h4>
    <hr />
    @Html.ValidationSummary(true, "", new { @class = "text-danger" })
<div class="form-group">
    <label class="control-label col-md-2"> Departamento </label>
    <div class="col-md-10">
@Html.DropDownListFor(model => model.id_departamento, new SelectList(Model.Departamentos, "id_departamento", "descripcion"), "--Select--", new {@id = "depto"})
    </div>
</div>    
<div class="form-group">
    <label class="control-label col-md-2"> Municipio </label>
    <div class="col-md-10">
@Html.DropDownListFor(model => model.id_municipio, new   SelectList(Model.municipiosLista, "id_municipio", "municipio"), "--Select--",   new { @id = "muni" })
    </div>
</div>

一切正常，因为它为我提供了从数据库中选择的所有值，我被困住并且无法前进，因为我需要一个市政列表的级联下拉列表，当我选择某些部门时，只有所选部门的市政当局出现在列表中。 例如，我选择了部门“atlantida”，其 ID 为 1，然后仅显示具有 Departamentos = 1 的外键的市政当局，我猜测需要 Jquery。

如果有人可以帮助我，那就太好了，我感到压力很大，因为我不知道我需要做什么。谢谢

我见过的所有示例都是关于使用 JSON 的，如下所示: http://www.c-sharpcorner.com/uploadfile/4d9083/creating-simple-cascading-dropdownlist-in-mvc-4-using-razor/ 但由于我已经拥有下拉菜单中的所有可用数据，我认为我不需要它，而只是一个我无法创建的普通 jquery 函数。

Answer 1

用这个解决了它:

<script type="text/javascript">//Script for Cascading Dropdown
    $(function () {
        $('#id_departamento').change(function() {
            var departmentId = $(this).val() || 0;
            $.ajax({
                url: '/Sitios/Municipios/',
                type: 'POST',
                data: { id_departamento: departmentId }, // parametro

                dataType: 'json',
                success: function (data) {

                    var options = $('#id_municipio');
                    $('option', options).remove(); // 

                    options.append($('<option />').val('').text('---'));

                    $.each(data, function () {
                        options.append($('<option />').val(this.id).text(this.name));
                    });
                } 

            }); 
        });

        });