Net Core dropdowns selection dyanmic to other dropdowns

<div class="votecell post-layout--left"></div> <div class="postcell post-layout--right"> <div class="post-text" itemprop="text">

Hi All,

I have a dropdown selection within my site that allows the user to select a department and then a job within that department.

I have it working if there is only one dropdown on the page, however I'm using being collection item as it's most likely that the user will need to select more than one department & job combo (picture attached to show what I mean)https://imgur.com/a/289N4aP

I have used ajax/json to get the list and its working perfectly in the first instance, however I cannot get it working for the multiples & I'm not knowledgeable enough in begin collection item to understand why.

I've included my code below:
Controller:

[HttpPost]publicPartialViewResultAddRACIResponsible(){var orderVM =newRACIResponsible();var getuser = _userManager.GetUserId(User);var compid =(from i in _context.CompanyClaimwhere i.UserId== getuserselect i.CompanyId).Single();var getdep =(from m in _context.Departmentswhere m.CompanyId== compidselectnew{ m.DepartmentId, m.DepartmentName}).ToList();

            orderVM.Departments=newList<RegisterDepartmentViewModel>();foreach(var items in getdep){var itemname =@items.DepartmentName;var itemId =@items.DepartmentId;
                orderVM.Departments.Add(newRegisterDepartmentViewModel{Value=@itemId,DepartmentId=@itemId,DepartmentName=@itemname});};returnPartialView("RACIResponsible", orderVM);}//Action result for ajax call[HttpPost]publicActionResultGetJobByDep(stringDepartmentId,stringRACIResponsible){List<RegisterJobTitleViewModel> objcity =newList<RegisterJobTitleViewModel>();
            objcity =GetAllCity().Where(m => m.DepartmentId==DepartmentId).ToList();foreach(var item in objcity){Console.WriteLine("Job Title");Console.WriteLine(item.JobTitle);}SelectList obgcity =newSelectList(objcity,"JobTitleId","JobTitle",0);returnJson(obgcity);}publicList<RegisterDepartmentViewModel>GetAllState(){var getuser = _userManager.GetUserId(User);var compid =(from i in _context.CompanyClaimwhere i.UserId== getuserselect i.CompanyId).Single();var getdep =(from m in _context.Departmentswhere m.CompanyId== compidselectnew{ m.DepartmentId, m.DepartmentName}).ToList();List<RegisterDepartmentViewModel> objstate =newList<RegisterDepartmentViewModel>();foreach(var items in getdep){
                objstate.Add(newRegisterDepartmentViewModel{DepartmentId= items.DepartmentId,DepartmentName= items.DepartmentName});};return objstate;}publicList<RegisterJobTitleViewModel>GetAllCity(){List<RegisterJobTitleViewModel> objcity =newList<RegisterJobTitleViewModel>();var getuser = _userManager.GetUserId(User);var compid =(from i in _context.CompanyClaimwhere i.UserId== getuserselect i.CompanyId).Single();var getjobs =(from m in _context.JobTitleswhere m.CompanyId== compidselectnew{ m.JobTitleId, m.JobTitle, m.DepartmentId}).ToList();foreach(var items in getjobs){Console.WriteLine(items.JobTitleId+ items.DepartmentId+ items.JobTitle);
                objcity.Add(newRegisterJobTitleViewModel{JobTitleId= items.JobTitleId,DepartmentId= items.DepartmentId,JobTitle= items.JobTitle});}return objcity;}

HTML/Ajax

@usingHtmlHelpers.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,newSelectList(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>}

</div> </div>