Извиняюсь, если заголовок неправильно описывает следующую проблему.
По сути, в моем файле cshtml
есть следующее:
<tbody>
@for (int i = 0; i < Model.ProgrammeScores.Count; i++)
{
<tr>
<td>
<input type="hidden" asp-for="@Model.ProgrammeScores[i].Id" />
<input type="text" asp-for="@Model.ProgrammeScores[i].FileDate" name="@Model.ProgrammeScores[i].FileDate" class="datepicker form-control" aria-describedby="calendar-addon" />
</td>
<td>
<select asp-for="@Model.ProgrammeScores[i].ScoreId" name="@Model.ProgrammeScores[i].ScoreIds" asp-items="@Model.Scores" id="ScoreIds" class="select-picker create-select"></select>
</td>
<td>
<textarea class="form-control" rows="2" asp-for="@Model.ProgrammeScores[i].Comments"></textarea>
</td>
<td>
</td>
</tr>
}
</tbody>
@Model.Scores
- это IList<SelectListItem>
Затем у меня есть кнопка, которая добавляет новую строку в таблицу с пустыми значениями, которую я хочу редактировать, и, следовательно, позволяю мне добавить новый счет в программу встроенной в фактической таблице.
Функция Javascript, которая добавляет строку в таблицу, выглядит следующим образом (я знаю, что я неправильно пытаюсь использовать код Razor здесь - здесь мне нужна помощь)
function addScorecard() {
var rowCount = parseInt($('#numOfScores').val());
var scoreTable = $('#programme-score-table');
var row = $([
'<tr>',
'<td>',
'<input type="hidden" asp-for="@Model.ProgrammeScores[' + rowCount + '].Id" />',
'<input type="text" asp-for="@Model.ProgrammeScores[' + rowCount + '].FileDate" name="@Model.ProgrammeScores[' + rowCount + '].FileDate" class="datepicker form-control" aria-describedby="calendar-addon" />',
'</td>',
'<td>',
'<select asp-for="@Model.ProgrammeScores[' + rowCount + '].ScoreId" name="@Model.ProgrammeScores[' + rowCount + '].ScoreIds" asp-items="@Model.Scores" id="ScoreIds" class="select-picker create-select"></select>',
'</td> ',
'<td>',
'<textarea class="form-control" rows="2" asp-for="@Model.ProgrammeScores[' + rowCount + '].Comments"></textarea>',
'</td> ',
'<td>',
'</td>',
'</tr>'
].join("\n"));
scoreTable.append(row);
}
Итакмой общий вопрос: как правильно реализовать эту функцию, чтобы при добавлении новой строки в таблицу ячейки правильно связывались со своими полями в модели, например, Select
правильно сопоставлялся с @Model.ProgrammeScores[i].ScoreId
, а также asp-items
, полученные из @Model.Scores
, правильно установлены в качестве параметров в раскрывающемся списке select
.
Я уже начал пытаться передать @Model.Scores
из cshtml
до js
с использованием <script> var scores = '@Html.Raw(Json.Serialize(Model.Scores))'; </script>
, но я все еще не смог заставить asp-items
работать на выпадающем меню.
Большое спасибо!