In this script below link I have a table that expands when we click on the line. How can I make it expand one at a time.
Example:
clico na primeira linha "**expande**"
se
clico em outra linha **também se expande mas fecha a anterior**
The intention is to leave one line expanded at a time
Do whatever is possible with CSS. The hide and show part can be done with CSS classes, as I had spoken in the other answer .
CSS
#report > tbody > tr:nth-child(even) {
display: none;
}
.abrir {
display: table-row !important;
}
jQuery:
$(document).ready(function () {
var escondidas = $("#report > tbody > tr:odd");
$("#report > tbody > tr:even").click(function () {
escondidas.removeClass('abrir');
$(this).next("tr").addClass('abrir');
$(this).find(".arrow").toggleClass("up");
});
});
Example: link