Как в бустратпе свернуть все открытые аккордеоны, закрывая родительский?

Question

[Levelse]

Добрый день, столкнулся с такой проблемой.

Есть таблица, с вложенными полями, имеет такой вид

<table class="table">
		<thead>
			<tr>
				<td></td>
				<td data-toggle="collapse" data-target="#ACCORDEON" class="clickable"></td>
				<td></td>
			</tr>
		</thead>


		<tr class="collapse" id="ACCORDEON">
			<td></td>
			<td data-toggle="collapse" data-target="#ACCORDEON2" class="clickable"></td>
			<td></td>
		</tr>

		<tbody class="collapse" id="ACCORDEON2">

			<tr>
				<td></td>
				<td></td>
				<td></td>
			</tr>
			
			<tr>
				<td></td>
				<td></td>
				<td></td>
			</tr>

		</tbody>
	</table>

При открытии все конечно работает, первый первая строка открывает вторую, вторая в свою очередь открывает еще 2 строки внутри tbody, но при закрытии первая строка прячет только вторую, следовательно 2 строки внутри tbody остаются открытыми, а мне необходимо, чтобы при нажатии на первую, сворачиволось всё.

Спасибо! Заранее извиняюсь, если некорректно изложил мысль.

Comments

[Сергей delphinpro]

getbootstrap.com/javascript/#collapse-methods

Answer 1

[Anton fon Faust]

Например, так:

$('#ACCORDEON').on('hide.bs.collapse', function () {
  $('#ACCORDEON2').collapse('hide');
})