handle multiselect list box values in asp.net core form submit with multiple records

Question

In ASP.NET CORE 2.0 , I am creating an Ajax form. Multiple employee can be updated in this form. There is an employee number and a multi-select list box to select reimbursement for an employee.
Problem is how to handle Reimbursement values because multiple items can be selected from list box. Form will be submitted as key-value pair.In the case of Reimbursement, Key is Reimbursement and values will be multiple. Therefore, how can it be checked what reimbursement was selected for which EmployeeID?

    @model myweb.NewWOModel

    <form id="frmWODetail" asp-action="EditMultipleEmployee" asp- controller="WOData" data-ajax="true" data-ajax-method="POST" data-ajax-success="onSuccess" data-ajax-failure="onFailed">
        @Html.AntiForgeryToken()
        <div class="row">
            <div class="col-sm-12">
            @foreach (var record in Model.MultipleEmployeeModels)
            {
                <div class="row">
                    <div class="col-sm-6">
                        <label>WorkOrder No.:</label>
                        <span>
                            @record.EmployeeNo
                        </span>
                    </div>
                    <div class="col-sm-6">
                        <input type="hidden"
                               name="EmployeeID"
                               value="@record.EmployeeID" />
                        </div>
                </div>

                <div class="row col-sm-12">
                    <select name="Reimbursement"
                            asp-for="@record.ReimbursementID"
                            asp-items="@(new SelectList(
                              Model.ReimbursementModels,
                              "ReimbursementID",
                              "ReimbursementName")
                            )" 
                            multiple>
                    </select>
                </div>
            }

            <div class="row">
                <div class="col-sm-12 text-right">
                    <input type="submit"
                           class="btn btn-success"
                           value="Save"/>          
                    <input type="button" 
                           class="btn btn-primary"
                           value="Close"
                           data- dismiss="modal" />
                </div>
            </div>
        </div>
    </form>


<script type="text/javascript">
    var onComplete = function () {

    };

    var onSuccess = function (context) {
        
    };

    var onFailed = function (context) {
        
    };

</script>

Controller

[HttpPost]
[ValidateAntiForgeryToken]
public async Task<JsonResult> EditMultipleEmployee(EmployeeModel empModel)
{
    //CODE HERE HOW TO HANDLE LIST BOX VALUES FOR EACH EMP       
}

Model

public class EmployeeModel 
{
    public string[] Reimbursement{get; set;}
    public string[] EmployeeID{get; set;}
}

public class NewWOModel
{
    public List<MultipleEmployeeModels> MultipleEmployeeModels{get; set;}
    public List<ReimbursementModel> ReimbursementModels{get; set;}
}

public class MultipleEmployeeModels
{
    public string EmployeeNo{get; set;}
    public int EmployeeID{get; set;}
}

public class ReimbursementModel
{
    public int ReimbursementID{get; set;}
    public string ReimbursementName{get; set;}
}

Answer 1

Since you have a relationship between Employee and Reimbursement, you need to change you model(s) to reflect that relationship (all you have is 2 independent collections). You need the following view models

public class EmployeeVM
{
    public int EmployeeID { get; set; }
    .... // other properties of Employee that you want in the view
    public int[] SelectedReimbursements { get; set; } // the selected reimbursements for an employee
}
public class EmployeeCollectionVM
{
    public List<EmployeeVM> Employees { get; set; }
    public IEnumerable<ReimbursementModel> ReimbursementOptions { get; set; }
}

and in the GET method you pass and instance of EmployeeCollectionVM to the view, which will be

@model EmployeeCollectionVM
<form id="frmWODetail" asp-action="EditMultipleEmployee" ....... >
    ....
    @for(int i = 0; i < Model.Employees.Count; i++)
    {
        <input type="hidden" asp-for="Employees[i].EmployeeID />
        <select asp-for="Employees[i].SelectedReimbursements" asp-items="@(new SelectList(Model.ReimbursementOptions,"ReimbursementID","ReimbursementName"))" multiple></select>
    ....
</form>

which will post back to

[HttpPost]
[ValidateAntiForgeryToken]
public async Task<JsonResult> EditMultipleEmployee(EmployeeCollectionVM model)