Пытаюсь сделать чтоб с помощью метода insertAfter появлялся tr с именем
function openModifiers() {
$('.selectView').click(function () {
var nameNotTrimmed = $(this).text();
var name = $.trim(nameNotTrimmed);
if ($(this).closest('tr').hasClass('opened')) {
var trimName = name.replace(/\s+/g, '');
$('.' + trimName + '').closest('tr').each(function () {
$(this).remove();
});
$(this).closest('tr').find('i').removeClass('fal fa-angle-down').addClass('fal fa-angle-right');
$(this).closest('tr').removeClass('opened');
return;
}
$('tr .active').removeClass('active');
$(this).addClass('active').siblings().removeClass('active'); //.siblings() поиск соседних элементов для выбраных элементов
$(this).closest('tr').addClass('opened');
$(this).closest('tr').find('i').removeClass('fal fa-angle-right').addClass('fal fa-angle-down');
$.ajax({
type: "POST",
url: "getModifiers",
data: {name: name},
beforeSend: function (xhr) {
xhr.setRequestHeader(csrfHeader, csrfToken);
},
success: function (data) {
for (var i = 0; i < data.length; i++) {
var trimName = name.replace(/\s+/g, '');
var tr = $('.active').closest('tr').index();
console.log(data[i].name);
$('<tr class="shown ' + trimName + '">' +
'<td>' + data[i].name + '</td>' +
'</tr>').insertAfter($('tr:eq(' + (tr + 1) + ')')
);
}
},
error: function (e) {
//alert("Ошибка в значении Шкалы размеров")
console.log("Ошибка в значении Шкалы размеров");
}
});
});
}
<!----------------------------------------------------------------------------------------------- Modal Modifiers-->
<div class="modal fade" id="addModifier" tabindex="-1" role="dialog" aria-hidden="true">
<div class="modal-dialog modal-lg" role="document">
<div class="modal-content">
<div class="modal-header">
<h3>Добавьте модификатор</h3>
<button type="button" class="close" data-dismiss="modal" aria-label="Close">
<span aria-hidden="true">×</span>
</button>
</div>
<div class="modal-body">
<div class="custom-control custom-checkbox mx-2">
<input type="checkbox" class="custom-control-input" id="groupModifier">
<label class="custom-control-label" for="groupModifier">Добавить групповой модификатор</label>
</div>
<div class="custom-control custom-checkbox mx-2">
<input type="checkbox" class="custom-control-input" id="showDishes">
<label class="custom-control-label" for="showDishes">Показать блюда</label>
</div>
<table class="table table-bordered" id="tableModifiers">
<thead>
<tr>
<th>Название</th>
</tr>
</thead>
<tbody>
<tr th:each="modifierNomenclature : ${modifierNomenclatures}">
<td th:inline="text" class="selectView"><i class="fa fa-angle-right" aria-hidden="true"></i>
[[${modifierNomenclature.name}]]
</td>
<!-- <td th:text="${modifierNomenclature.name}"><i class="fa fa-angle-right" aria-hidden="true"></i></td>-->
<input type="hidden" th:value="${modifierNomenclature.id}">
</tr>
</tbody>
</table>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-secondary" data-dismiss="modal">Закрыть</button>
<button type="button" class="btn btn-primary" onclick="saveModifiers()" data-dismiss="modal">
Сохранить
</button>
</div>
</div>
</div>
</div>