Добрый День! Суть вопроса!
Есть Модалка в ней я нажатием на кнопку создаю несколько <input> в таблице
Одну таблицу я обрабатываю функцией addAll
Как обработать 2,3,4 такие таблицы!
->
CodePan <-
<body>
<th:block th:include="/admin/fragments/menu-body :: menu"></th:block>
<div class="container-fluid">
<button class="btn btn-success" data-toggle="modal" data-target="#addAll">Добавить</button>
</div>
</div>
<!-------------------------------------------------------------------------------------------------------Modal addAll-->
<div id="addAll" class="modal fade" tabindex="-1">
<div class="modal-dialog modal-lg">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal">×</button>
</div>
<div class="modal-body">
<div class="form-group">
<label for="validityNameAll">Введите название:</label>
<input class="form-control" type="text" id="validityNameAll" required="required" name="name">
<button type="button" class="btn btn-success addScheduleDown" onclick="addScheduleDown()">Добавить график</button>
</div>
</div>
<div class="modal-footer">
<button type="submit" class="btn btn-success" onclick="addAll()">Сохранить</button>
<button type="button" class="btn btn-danger" data-dismiss="modal">Закрыть</button>
</div>
</div>
</div>
</div>
</body>
</html>
//добавление новой таблицы в модалку
function addScheduleDown() {
$("button.addScheduleDown").after( "" +
"<table class=\"table\"> <thead>\n" +
"<tr>\n" +
"<th><label for=\"beginTimeAll\">Начало</label></th>\n" +
"<th><label for=\"mondayAll\">Пн</label></th>\n" +
"</tr>\n" +
"</thead>\n" +
"<tbody>\n" +
"<tr>\n" +
"<td><input type=\"time\" id=\"beginTimeAll\" name=\"beginTime\" required=\"required\"/></td>\n" +
"<td><input type=\"checkbox\" id=\"mondayAll\" name=\"monday\"/></td>\n" +
"</tr>\n" +
"</tbody>" +
"</table>");
}
//отправка значений на сервер в БД
function addAll() {
var nameValidity = $('#validityNameAll').val();
var beginTime = $('#beginTimeAll').val();
var monday = $("#mondayAll").prop('checked');
var validity = {
nameValidity:nameValidity,
validityScheduleList:[{
beginTime: beginTime,
monday: monday,
tuesday: tuesday,
}]
};
$.ajax({
type: "POST",
url: "/schedule/addAll",
contentType: "application/json; charset=utf-8",
data: JSON.stringify(validity),
beforeSend: function (xhr) {
xhr.setRequestHeader(csrfHeader, csrfToken);
},
success: function (data) {
window.location.replace("/validity");
},
error: function (e) {
alert("error")
}
});
}