Нужна помощь в создании выпадающего списка Jquery cascadia

Question

Нужна помощь в создании выпадающего списка Jquery cascadia

Я очень новичок в jquery и не знаю, как это сделать. Я сделал быстрый пример проекта, чтобы опробовать его, но у меня ничего не было со стороны jquery.

вот моя модель.

public class Life
{
    public static List<Life> MyList = new List<Life>
    {
        new Life {first="Animal",second="Mammal",third ="human"},
        new Life {first="Plant",second="Tree",third ="cherry"},
        new Life {first="Plant",second="Grass",third ="rye"},
        new Life {first="Plant",second="Tree",third ="oak"}
    };

    public string first {get; set;}
    public string second {get; set;}
    public string third {get; set;}
}

Я хочу создать представление, которое имеет 3 раскрывающихся списка. Первый заполняется первым рядом, а затем второй ряд переходит во второй выпадающий список и т. Д. Таким образом, первый выпадающий список будет содержать «Животное и растение». И если вы выберете Растение, вы не увидите Млекопитающее во втором выпадающем меню.

Есть ли хорошие примеры? Или как бы я работал с этим примером модели в представлении, которое делает это?

Answer 1

Самый крутой способ создать такой выпадающий список - это html помощник.Я создал один для выбора языка (мой очень простой, и данные должны поступать из БД и т. Д., Но у меня не было времени).Это даст вам представление:

Помощник выпадающего списка:

 public static class HtmlHelpers
    {
       public static MvcHtmlString LanguageDropDownListFor<TModel, TValue>(this HtmlHelper<TModel> html, Expression<Func<TModel, TValue>> expression)
        {
            var dutch = new SelectListItem() { Selected = true, Text = "nl-be", Value = "nl-be" };
            var french = new SelectListItem() { Selected = false, Text = "fr-be", Value = "fr-be" };
            var list = new List<SelectListItem> { dutch, french };
            return html.DropDownListFor(expression, list);
        }
}

Тогда у меня есть модель (для вас важна только языковая область!):

public class Answer

{
    [Key]
    public Guid Id { get; set; }

    public Guid QuestionId { get; set; }
    public virtual Question Question { get; set; }

    public string Text { get; set; }

    [MaxLength(5)]
    public string Language { get; set; }
    public int Order { get; set; }

    public virtual ICollection<UserAnswer> UserAnswers { get; set; }
}

и затем, по вашему мнению, используйте:

@Html.LanguageDropDownListFor(model => model.Language)
    @Html.ValidationMessageFor(model => model.Language)

Если вам нужна дополнительная помощь, дайте мне знать:)