pure PHP or CSS - tree menu show only active nodes
I have built a tree menu in PHP, using a recursive function, which works ok. My menu structure is something like this:
Root
----Categ1
-------Categ11
---------Categ111
---------Categ112
-------Categ12
---------Categ121
---------Categ122
----Categ2
----Categ3
----Categ4
I am using bootstrap.
I need to show only the active nodes and the top level children. For my example I need the menu to be opened like this (I clicked on Categ 112 and subcategories of Categ12 to be hidden):
Root
----Categ1
-------Categ11
---------Categ111
---------Categ112
-------Categ12
----Categ2
----Categ3
----Categ4
The PHP function that generate my menu tree is:
/** show all subcategs of the selected category
* @param $iCategIDSelected
* @param null $arrCategs
* @param bool $bIsOnTheLeaf
* @return string
*/
static function getHTMLCategsForMenuBySelected($iCategIDSelected, $arrCategs=null, $arrAllParents=null){
$bIsVisible = false;
if($arrCategs == null){
$oController = new ShopcategoriesController();
$arrCategs = $oController->getShopCategories(0);
}
//find if we make the current node visible or not
//if the current node id is on the parent's of the selected node then make it visible
//take all nodes starting with root until the selected node
if($arrAllParents==null){
$arrAllParents = ShopcategoriesController::getParentsBySelectedCategID($iCategIDSelected,$arrCategs);
}
$sHTML = '';
return $sHTML;
}
The html structure is:
ul.nav > li > a{
padding-left: 30px;
}