mirror of https://github.com/4xmen/xshop.git
added nested list control
parent
1f79ba74b0
commit
237f069b91
@ -0,0 +1,29 @@
|
||||
document.addEventListener('DOMContentLoaded', function () {
|
||||
document.querySelectorAll('.nested-list')?.forEach(function (list) {
|
||||
list.querySelectorAll('li').forEach(function (li) {
|
||||
// Check if the <li> has a <ul> child
|
||||
const ulChild = Array.from(li.children).find(child => child.tagName === 'UL');
|
||||
|
||||
// Check if the <ul> is not empty (has at least one <li> child)
|
||||
const hasLiChildInUl = ulChild && ulChild.querySelectorAll('li').length > 0;
|
||||
|
||||
if (hasLiChildInUl) {
|
||||
let plus = document.createElement('i');
|
||||
plus.setAttribute('class','ri-arrow-down-wide-line float-end mx-2');
|
||||
li.prepend(plus);
|
||||
li.classList.add('nested-parent');
|
||||
plus.addEventListener('click',function () {
|
||||
this.parentNode.querySelector(':scope > ul').classList.toggle('active');
|
||||
if (this.classList.contains('ri-arrow-down-wide-line')){
|
||||
span.classList.remove('ri-arrow-down-wide-line');
|
||||
span.classList.add('ri-arrow-up-wide-line');
|
||||
}else{
|
||||
span.classList.remove('ri-arrow-up-wide-line');
|
||||
span.classList.add('ri-arrow-down-wide-line');
|
||||
|
||||
}
|
||||
});
|
||||
}
|
||||
});
|
||||
});
|
||||
});
|
Loading…
Reference in New Issue