After purchasing a template from ThemeForest, I found it to be absolutely amazing. However, I am struggling with using Bootstrap as it seems quite complex.
The left menu is structured with collapsible ul
and multiple li
elements. I am seeking assistance on how to detect the "event" when the ul group is collapsed or expanded.
<ul class="nav nav-pills nav-stacked" style="margin-top:-15px;" >
<li class="parent active">
<a href="#">
<i class="fa fa-home"></i>
<span>Tiêu chí tìm kiếm</span>
</a>
<ul class="children">
<li>
<div class="input-group">
<input type="text" class="form-control" placeholder="Chọn ngày theo dõi từ" id="datepickerFrom">
<span class="input-group-addon">
<i class="glyphicon glyphicon-calendar"></i>
</span>
</div><!-- input-group -->
</li>
<li>
<div class="input-group">
<input type="text" class="form-control" placeholder="Chọn ngày theo dõi đến" id="datepickerTo">
<span class="input-group-addon">
<i class="glyphicon glyphicon-calendar"></i>
</span>
</div><!-- input-group -->
</li>
</ul>
</li>
</ul>
I am specifically looking for a solution to handle the collapsing of the children li when a user clicks on the "Tiêu chí tìm kiếm" row.