Итак, я динамически создаю строки таблицы, в которых есть переключатели.Я хочу, чтобы пользователь мог выбрать переключатель, и это информация, которая добавляется в модель.
HTML
Хорошо, поэтому у меня есть таблицакоторый начинается совершенно пустым.Когда пользователь ищет клиента, в таблицу будут добавлены строки (после нажатия кнопки поиска).Но для начала вот что у нас есть:
<div class="row border mt-3 p-3" id="policyInfo">
<div class="input-group mb-3 ">
<h3 class="col-lg-12 blue redUnderline">Policy Information</h3>
</div>
<TABLE class="table mt-3" id="policyTable">
<thead>
<tr>
<th scope="col">@Html.LabelFor(m => m.PolicyTypes)</th>
<th scope="col">@Html.LabelFor(m => m.policyID)</th>
<th scope="col">@Html.LabelFor(m => m.PolicyExpirationDate)</th>
<th scope="col"> @Html.LabelFor(m => m.PolicyStatus)</th>
<th scope="col"> @Html.LabelFor(m => m.Agency)</th>
<th scope="col"> @Html.LabelFor(m => m.AgencyCert)</th>
</tr>
</thead>
<TR></TR>
</TABLE>
</div>
Это выглядит так:
JQUERY /AJAX
Мой JQuery / Ajax / Controller общается с контроллером, который общается с базой данных и на основе имени / адреса электронной почты, при условии, что он возвращает данные и просит мою функцию JavaScript создать новую строку.
$('#search').click(function () {
$.ajax({
type: "Post",
url: "/Home/PolicyID_get",
dataType: 'json',
data: {
Firstname: $('#firstname').val(),
Lastname: $('#lastname').val(),
Email: $('#email').val(),
},
success: function (data) {
$.each(data, function (i, result) {
addRowsPolicyHolder("policyTable", result.Policyid, result.PolicyStatus, result.PolicyExpirationDate, result.Agencycode, null);
});
}
});
});
JavaScript Мой JS проверяет, существует ли номер идентификатора строки (например, существует ли первая строка и т. Д.), И создает новый номер строки на основе этого.Приведенный ниже код показывает только то, как выполняются переключатель и идентификатор политики, но остальная часть строки таблицы находится в моем коде.
function addRowsPolicyHolder(tableId, policyId, policyStatus, policyExp, certifyingAgency, agencyCertId) {
var iteration = 0;
var stop = false;
while (stop == false) {
var elementChk = "[" + iteration + "].policyID";
var checkId = document.getElementById(elementChk);
if (checkId) {
stop = false;
} else {
var table = document.getElementById(tableId);
var rowCount = table.rows.length;
var row = table.insertRow(rowCount);
var cell0 = row.insertCell(0);
var element0 = document.createElement("input");
var element0Label = document.createElement("label");
var element0Span = document.createElement("span");
element0Label.className = "radioContainer";
element0Span.className = "checkmark";
element0.type = "radio";
element0.id = "[" + iteration + "].chkbox";
element0.name = "policyCheckBox";
element0Label.appendChild(element0);
element0Label.appendChild(element0Span);
cell0.appendChild(element0Label);
var cell1 = row.insertCell(1);
var element1 = document.createElement("input");
element1.type = "text";
element1.id = "[" + iteration + "].policyID";
element1.name = "[" + iteration + "].policyID";
element1.className = "form-control";
element1.disabled = true;
element1.value = policyId;
cell1.appendChild(element1);
Но у нас настроен контроллер для возврата спискаклиенты, а не только первый результат, так как клиенты могут иметь более одной политики.Если возвращается более одной политики, будет возвращено несколько строк.Кроме того, скажем, кто-то приходит со своим супругом, и мы ищем их информацию, но они также хотят узнать, есть ли у их супруга более выгодная политика.Мы можем искать несколько человек, и появится несколько политик.
Все это прекрасно работает.Я просто не могу понять, как отправить ТОЛЬКО проверенную строку в модель.
Я нашел некоторые решения, в которых для этого используется синтаксис бритвы, но так как я создаюстроки динамически, я не могу заставить его работать.