根据asp.net Core Razor页面中的第一个下拉列表填充第二个下拉列表

Question

我在asp.net Core MVC中有一个表单，其中包含多个文本输入字段和两个下拉菜单（选择）。当第一个选择的索引更改时，第二个选择的选项需要更改。 （我选择了一个具有第一个选择的项目，并选择了第二个选择在该项目中的一行）。

如何在不丢失所有其他文本字段输入（回发/重新加载）的情况下更改选择中的选项

这是我到目前为止的代码

<form asp-controller="Settings" asp-action="Login" method="post">

...

<!--Project-->
<select name="board">
    @if (userIndex == 0 || userData[userIndex].ProjectId == null)
    {
        <option selected disabled value="-1">Choose a Project</option>
    }
    @for (int i = 0; i < projectData.Count; i++)
    {
        if (userIndex != 0 && userData[userIndex].ProjectId == projectData[i].Idx)
        {
            <option selected value="@projectData[i].Idx">@projectData[i].projectName</option>
        }
        else
        {
            <option value="@projectData[i].Idx">@projectData[i].projectName</option>
        }
    }
</select>

<!--Row-->
<!--todo update this after project change and show only rows from one project-->
<select name="row">
    @if (userIndex == 0 || userData[userIndex].RowId == null)
    {
        <option selected disabled value="-1">Choose a Row</option>
    }
    @{
        List<Row> filteredRowData = rowData.Where(row => /*Match selected Project from name="board"*/).ToList();
    }
    @for (int i = 0; i < filteredRowData.Count; i++)
    {
        if (userIndex != 0 && userData[userIndex].RowId == rowData[i].Idx)
        {
            <option selected value="@rowData[i].Idx">@rowData[i].RowName</option>
        }
        else
        {
            <option value="@rowData[i].Idx">@rowData[i].RowName</option>
        }
    }
</select>

...

</form>