Я использую. NET CORE MVC для создания некоторых форм для добавления пользователей в систему (ручной процесс). Одна из форм, которые я получил, - это простая многопользовательская пользовательская форма, которая позволяет пользователю вводить имена в форму и нажимать кнопку «Отправить», где она затем сериализуется и преобразуется в документ PDF для сохранения на локальном компьютере.
Я хотел сделать это с динамической c HTML таблицей, поэтому у меня есть следующая настройка. Намерение здесь состоит в том, чтобы позволить изначально запустить таблицу с одной пустой редактируемой строки и дать возможность добавлять строки по мере необходимости, связывая каждую строку со списком объектов в модели.
Класс пользователя
[Serializable]
public class User
{
[Display(Name = "M.I.")]
public string MiddleInitial { get; set; }
[Display(Name = "Suffix")]
public string NameSuffix { get; set; }
[Required(AllowEmptyStrings = false)]
[Display(Name = "First Name")]
public string FirstName { get; set; }
[Required(AllowEmptyStrings = false)]
[Display(Name = "Last Name")]
public string LastName { get; set; }
}
Класс MultiAddUser
[Serializable]
public class MultiAddUser
{
[Required]
[Display(Name = "Start Date")]
public DateTime StartDate { get; set; }
public List<User> Users { get; set; }
public MultiAddUser()
{
Users = new List<User>();
}
}
В моем представлении есть следующий код, который отображает таблицу basi c с входными данными в ячейках с возможностью добавления ячеек на лету.
@using Contract
@model MultiAddUser
@section Scripts{
<script>
function addRow() {
var table = document.getElementById("MultiAddUserTable");
var row = table.insertRow(-1);
var cell1 = row.insertCell(0);
cell1.innerHTML = '<input type="text" />';
var cell2 = row.insertCell(1);
cell2.innerHTML = '<input type="text" />';
var cell3 = row.insertCell(2);
cell3.innerHTML = '<input type="text" />';
var cell4 = row.insertCell(3);
cell4.innerHTML = '<input type="text" />';
}
</script>
}
<style>
input {
width: 100%;
}
</style>
<body>
<h2 class="formtitle">ADD MULTIPLE USERS</h2>
<form method="post" asp-action="AddMultipleUsers" id="addMultiUsers">
<div class="form-group">
<div class="form-row">
<div class="form-group col-sm-2">
<label asp-for="StartDate"></label>
<input type="date" asp-for="StartDate" class="form-control" />
<span asp-validation-for="StartDate" class="text-danger"></span>
</div>
</div>
<table id="AddMultipleUsersTable">
<tr>
<th>First Name</th>
<th>Middle Initial</th>
<th>Last Name</th>
<th>Suffix</th>
</tr>
<tr>
<td><input type="text" /></td>
<td><input type="text" /></td>
<td><input type="text" /></td>
<td><input type="text" /></td>
</tr>
</table>
<button type="button" onclick="addRow()">Add</button>
<hr />
<div class="form-row">
<div id="submitbutton">
<input id="submit" class="btn btn-primary btn-lg" style="background-color: #4CAF50; color:white;" type="submit" />
</div>
</form>
</body>
Теперь обычно с ASP. NET Core MVC в помощнике тега ввода будет просто что-то вроде asp-for="@Model.Property[IndexIfNeeded]", но так как список начинается пустым и не связан с базой данных Мне не удается собрать воедино то, как я go добавлю каждую новую строку в качестве нового элемента в список модели после отправки всей формы.
Возможно, я слишком усложняю это, поскольку данные никогда не нужно вводить в базу данных, но их нужно сериализовать и преобразовывать в документ PDF, а затем распечатывать в конце процесса, поэтому любая оценка альтернативных методов для достижения sh будет приветствоваться.
В итоге, Как я могу связать строки / столбцы, добавленные динамически в эту таблицу, с моими объектами модели, сохраняя при этом правила проверки для каждого требуемого свойства?