Может ли кто-нибудь помочь мне решить следующую проблему привязки с несколькими раскрывающимися списками? ⇐ Jquery

[Anonymous]

Я хочу связать второй раскрывающийся список на основе выбранного параметра первого раскрывающегося списка.
[img]https://i.sstatic.net /f5B9GVx6.png[/img]

Также при добавлении второго раскрывающегося списка первая выбранная система должна быть отключена.


Html раскрывающегося списка выглядит следующим образом:
var logintypeList = Model.LoginTypeList
.
.
.
.


Login System and Type
@Html.DropDownListFor(m => m.LoginTypeIds, new SelectList(Model.LoginTypeList, "Id", "Name"), new { @class = "form-control chosen-select assign-system-login-type", multiple = "multiple" , @value = Model.LoginTypeIds})



В Js у меня был раскрывающийся список типов входа в систему при выборе типа системы. Но это работает только в первый раз, мне нужно это решение после добавления нескольких раскрывающихся списков:
$(document).ready(function () {
initializeSelect2();
});

function initializeSelect2() {
$('select.addTags, select.addSystem').select2({
width: '100%',
maximumInputLength: 20
});
}
$('.assign-system-login-type').on('select2:select', function (e) {
$(".addTags").empty()
var logintypeList = @Html.Raw(Json.Serialize(logintypeList));
var optionno = 0;
$(logintypeList).each(function (index) {
if (e.params.data.id == this.systemType) {
var $newOption = $("").val(index).text(this.name)
$(".addTags").append($newOption).trigger('change');
optionno = optionno + 1;
}
});
if (optionno == 0) {
var $newOption = $("").val("").text("No Options")
$(".addTags").append($newOption).trigger('change');
}
});


Подробнее здесь: https://stackoverflow.com/questions/786 ... ng-problem