1

Ситуация такая пишу сайт на Asp.net MVC 5 есть форма создания животного, есть два Select в одном вид животного а в втором порода. Ну и нужно реализовать чтоб при изменение первого, в второй подгружались данные з бази. Вот как я формирую эти Select по дефолту.

<div class="form-group">
        @Html.LabelFor(model => model.Type, htmlAttributes: new { @class = "control-label col-md-2" })
        <div class="col-md-10">
            @Html.DropDownListFor(model => model.Type, ViewBag.type as SelectList)
            @Html.ValidationMessageFor(model => model.Type, "", new { @class = "text-danger" })
        </div>
    </div>
    <div class="form-group">
        @Html.LabelFor(model => model.Species, htmlAttributes: new { @class = "control-label col-md-2" })
        <div class="col-md-10">
            @Html.DropDownListFor(model => model.Species, ViewBag.species as SelectList)
            @Html.ValidationMessageFor(model => model.Species, "", new { @class = "text-danger" })
        </div>
    </div>

Как я понимаю нужно это сделать лыбо в JQuery, или в AJAX. Но сам не знаю как это сделать. Помогите пожалуста

1 ответ 1

1

Здесь дело не в селектах, а в том, что тебе нужно отследить событие изменения значения первого выпадающего списка, в функции-хендлере взять его значение, сделать запрос на сервер (аякс), на сервере достать данные для второго выпадающего списка (селектом или как-то еще) и по success в aякс-запросе заполнить второй Ddl полученными значениями.

На клиенте примерно так:

@Html.DropDownListFor(model => model.Type, new SelectListItem[]    
{
 new SelectListItem() { Text = "Text1", Value = "0" }, 
 new SelectListItem() { Text = "Text2", Value = "1" }
},
 new { @onchange="onChange(this.value)" })


<script>
function onChange(val)
{
 var typeVal = $('#Type').val()
 $.post( '@Url.Action("GetSpecies","Controller")', {typeVal : typeVal }
  function( data ) {
       var select = $("#Type");
       select.empty();
        $.each(data, function (index, itemData) {
                        select.append($('<option/>', {
                            value: data.Value,
                            text: data.Text
                        }));
                    });
  });
}
</script>

Ваш ответ

By clicking “Отправить ответ”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.

Всё ещё ищете ответ? Посмотрите другие вопросы с метками или задайте свой вопрос.