Выбор выпадающих Net Net динамически переходит в другие выпадающие

Question

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

У меня это работает, если на странице есть только один раскрывающийся список, однако я использую элемент коллекции, так как, скорее всего, пользователю потребуется выбрать более одной комбинации отдела и задания (изображение прикреплено, чтобы показать, что я имею в виду) https://imgur.com/a/289N4aP

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

Я включил свой код ниже:

контроллер:

[HttpPost]
        public PartialViewResult AddRACIResponsible()
        {
            var orderVM = new RACIResponsible();
            var getuser = _userManager.GetUserId(User);
            var compid = (from i in _context.CompanyClaim
                          where i.UserId == getuser
                          select i.CompanyId).Single();

            var getdep = (from m in _context.Departments
                          where m.CompanyId == compid
                          select new { m.DepartmentId, m.DepartmentName }).ToList();

            orderVM.Departments = new List<RegisterDepartmentViewModel>();
            foreach (var items in getdep)
            {
                var itemname = @items.DepartmentName;
                var itemId = @items.DepartmentId;
                orderVM.Departments.Add(new RegisterDepartmentViewModel { Value = @itemId, DepartmentId = @itemId, DepartmentName = @itemname });
            };

            return PartialView("RACIResponsible", orderVM);
        }

        //Action result for ajax call
        [HttpPost]
        public ActionResult GetJobByDep(string DepartmentId, string RACIResponsible)
        {
            List<RegisterJobTitleViewModel> objcity = new List<RegisterJobTitleViewModel>();
            objcity = GetAllCity().Where(m => m.DepartmentId == DepartmentId).ToList();
            foreach(var item in objcity){
                Console.WriteLine("Job Title");
                Console.WriteLine(item.JobTitle);
            }
            SelectList obgcity = new SelectList(objcity, "JobTitleId", "JobTitle", 0);
            return Json(obgcity);
        }


        public List<RegisterDepartmentViewModel> GetAllState()
        {
            var getuser = _userManager.GetUserId(User);
            var compid = (from i in _context.CompanyClaim
                          where i.UserId == getuser
                          select i.CompanyId).Single();

            var getdep = (from m in _context.Departments
                          where m.CompanyId == compid
                          select new { m.DepartmentId, m.DepartmentName }).ToList();
            List<RegisterDepartmentViewModel> objstate = new List<RegisterDepartmentViewModel>();
            foreach (var items in getdep)
            {
                objstate.Add(new RegisterDepartmentViewModel { DepartmentId = items.DepartmentId, DepartmentName = items.DepartmentName });
            };
            return objstate;
        }

        public List<RegisterJobTitleViewModel> GetAllCity()
        {
            List<RegisterJobTitleViewModel> objcity = new List<RegisterJobTitleViewModel>();

            var getuser = _userManager.GetUserId(User);
            var compid = (from i in _context.CompanyClaim
                          where i.UserId == getuser
                          select i.CompanyId).Single();
            var getjobs = (from m in _context.JobTitles
                           where m.CompanyId == compid
                           select new { m.JobTitleId, m.JobTitle, m.DepartmentId }).ToList();
            foreach (var items in getjobs)
            {
                Console.WriteLine(items.JobTitleId + items.DepartmentId + items.JobTitle);
                objcity.Add(new RegisterJobTitleViewModel { JobTitleId = items.JobTitleId, DepartmentId = items.DepartmentId, JobTitle = items.JobTitle });
            }
            return objcity;
}

HTML / Ajax

    @using HtmlHelpers.BeginCollectionItemCore
    @using (Html.BeginCollectionItem("RACIResponsible"))
    {
        var jobdropname = ViewData["ContainerPrefix"] + ".JobTitleId";
        var dropname = ViewData["ContainerNoNum"].ToString().Replace("-", "");
        ViewBag.functionname =  "function GetCity" + @dropname + "(_stateId)";

        <div class="col-12 col-md-6">
                        @Html.DropDownListFor(m => m.DepartmentId,
                             new SelectList(Model.Departments, "DepartmentId", "DepartmentName"), "Select Department", new { @id = "ddlstate", @class = "form-control", @onchange = "javascript:GetCity"+ @dropname + "(this.value);" })
                    </div>
                    <div class="col-12 col-md-5">
                        <select id="ddlcity" name='@jobdropname' class="form-control drop-@ViewData["ContainerNoNum"]">

                        </select>
                    </div>
    <script>
       @ViewBag.functionname {
        var procemessage = "<option value='0'> Please choose a department...</option>";
        $(".drop-@ViewData["ContainerNoNum"]").html(procemessage).show();
        var url = '@Url.Action("GetJobByDep")';  
        $.ajax({
            url: url,
            data: { DepartmentId: _stateId },
            cache: false,
            type: "POST",
            success: function (data) {
                var markup = "<option value='0'>Select Job</option>";
                for (var x = 0; x < data.length; x++) {
                    markup += "<option value=" + data[x].value + ">" + data[x].text + "</option>";
                }
                $("#ddlcity").html(markup).show();
            },
            error: function (reponse) {
                alert("error : " + reponse);
            }
        });
    };
    </script>
    }