Question

此部分创建工作机会（这是一个工作门户），您需要从中选择“区域”和“子区域”。当我选择一个区域时，我应该看到该区域的子区域。我留下图像来查看表格的组成：

我的工作机会模型是这样的：

namespace ProyectoBase4.Models
{
using System;
using System.Collections.Generic;

public partial class OfertaLaboral
{
[System.Diagnostics.CodeAnalysis.SuppressMessage("Microsoft.Usage", "CA2214:DoNotCallOverridableMethodsInConstructors")]
public OfertaLaboral()
{
    this.OfertaPostulante = new HashSet<OfertaPostulante>();
}

public int Of_ID { get; set; }
public Nullable<int> OfEmp_ID { get; set; }

public string Of_Titulo { get; set; }
public string Of_Puesto { get; set; }
public Nullable<int> Of_Area { get; set; }
public Nullable<int> Of_Subarea { get; set; }
public string Of_Descrp { get; set; }
public string Of_Lugar { get; set; }
public Nullable<int> Of_Vacante { get; set; }
public Nullable<System.DateTime> Of_FechaIn { get; set; }
public Nullable<System.DateTime> Of_FechaFin { get; set; }
public Nullable<int> Of_Salario { get; set; }
public Nullable<int> Of_Jornada { get; set; }
public Nullable<int> Of_Mov { get; set; }
public Nullable<int> Of_Edu { get; set; }
public Nullable<int> Of_TContrato { get; set; }
public Nullable<int> Of_Estado { get; set; }

public virtual Area Area { get; set; }
public virtual Educacion Educacion { get; set; }
public virtual Estado Estado { get; set; }
public virtual Jornada_Compl Jornada_Compl { get; set; }
public virtual Movilidad Movilidad { get; set; }
public virtual Subarea Subarea { get; set; }
public virtual TipoContrato TipoContrato { get; set; }
[System.Diagnostics.CodeAnalysis.SuppressMessage("Microsoft.Usage", "CA2227:CollectionPropertiesShouldBeReadOnly")]
public virtual ICollection<OfertaPostulante> OfertaPostulante { get; set;         }
}
}

如何通过在Area中选择一个字段来显示对应的Subtareas？这是视图：

<div class="">
                    <div class="form-group col-md-8">
                        @Html.LabelFor(model => model.Of_Titulo, htmlAttributes: new { style = "" })
                        <div class="">
                            @Html.EditorFor(model => model.Of_Titulo, new { htmlAttributes = new { @class = "form-control" } })
                            @Html.ValidationMessageFor(model => model.Of_Titulo, "", new { @class = "text-danger" })
                        </div>
                    </div>
                    <div class="form-group col-md-3">
                        @Html.LabelFor(model => model.Of_Area, htmlAttributes: new { @class = "", style = "margin-left:10px;" })
                        <div class="">
                            @Html.DropDownList("Of_Area", null, htmlAttributes: new { @class = "form-control form-control-75", style = "margin-left:10px;" })
                            @Html.ValidationMessageFor(model => model.Of_Area, "", new { @class = "text-danger" })

                        </div>
                    </div>

                </div>
                <br /><br /><br /><br />
                <div>
                    <div class="form-group col-md-4">
                        @Html.LabelFor(model => model.Of_Vacante, htmlAttributes: new { @class = "" })
                        <div class="">
                            @Html.EditorFor(model => model.Of_Vacante, new { htmlAttributes = new { @class = "form-control form-control-50" } })
                            @Html.ValidationMessageFor(model => model.Of_Vacante, "", new { @class = "text-danger" })
                        </div>
                    </div>
                    <div class="form-group col-md-4">
                        @Html.LabelFor(model => model.Of_Salario, htmlAttributes: new { @class = "" })
                        <div class="">
                            @Html.EditorFor(model => model.Of_Salario, new { htmlAttributes = new { @class = "form-control form-control-50" } })
                        </div>
                    </div>

                    <div class="form-group col-md-3">
                        @Html.LabelFor(model => model.Of_Subarea, htmlAttributes: new { @class = "", style = "margin-left:40px;" })
                        <div class="">
                            @Html.DropDownList("Of_Subarea", null, htmlAttributes: new { @class = "form-control  form-control-75", style = "margin-left:40px;" })
                            @Html.ValidationMessageFor(model => model.Of_Subarea, "", new { @class = "text-danger" })

                    </div>
                </div>

如前所述，当我选择一个选项时，当我选择子选项时，我只需要那个区域的选项出现在我身上。

示例：

view

谢谢

Answer 1

首先，在具有区域的subarea选项中添加一个属性。

可以在此处找到示例：SelectListItem with data-attributes

第二，处理jQuery中change()下拉菜单中的area事件。使用该事件处理程序hide()不在该区域中的所有选项，show()那些不在该区域的选项。

$("#Of_Area").change(function(){
   $("#Of_Subarea>option").hide();
   $("#Of_Subarea>option[area=" + $("#Of_Area>option:selected").attr("value") + "]").show();
});

Dropdownlist依赖另一个吗？ ASP.NET MVC

1 个答案: