Заполните второй выпадающий список в зависимости от первого выпадающего на основных страницах Razor asp.net - PullRequest
Новая
       43

Заполните второй выпадающий список в зависимости от первого выпадающего на основных страницах Razor asp.net

1 голос
/ 03 июня 2019

У меня есть форма в 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>
...