0

Ok! I am not using Primefaces/Omnifaces or Bootfaces, the requirement is to do it using Bootstrap only.

What I am trying to achieve is creating nested menu dynamically, I have been able to achieve only one level Menu.

<nav class="navbar navbar-expand-lg navbar-light bg-light">
        <a class="navbar-brand" href="#">LAS</a>
        <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarSupportedContent" aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation">
            <span class="navbar-toggler-icon"></span>
        </button>
        <div class="collapse navbar-collapse" id="navbarSupportedContent">
            <ul class="navbar-nav mr-auto">

                <ui:repeat value="#{menuViewModel.parentMenu}" var="parentMenuItem">
                    <li class="nav-item dropdown">
                        <a class="nav-link dropdown-toggle" href="#" id="navbarDropdown" role="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
                            #{parentMenuItem.menuLabel}
                        </a>
                        <div class="dropdown-menu" aria-labelledby="navbarDropdown">
                            <ui:repeat value="#{menuViewModel.generateChildMenu(parentMenuItem.menuName)}" var="childMenuItem">
                                <a class="dropdown-item" href="#">#{childMenuItem.menuLabel}</a>
                            </ui:repeat>
                        </div>
                    </li>
                </ui:repeat>
            </ul>
            <button class="btn btn-outline-success my-2 my-sm-0 dropdown">
                <span class="glyphicon glyphicon-user"></span> User
            </button>
        </div>
    </nav>

Now, as there may be many number of children (though we have only 3 level of nested menu items yet) the problem starts. How I have to change my xhtml to generate nested menus.

The attached image shows first level of Menu.

enter image description here

As you can see, the menu item Host Configuration has another sub items but I am not able to understand how I can show it on my view.

Do I have to use recursive logic or something or there is a need to write some EL?

Thanks

Kukeltje
  • 12,223
  • 4
  • 24
  • 47
Faizan Mubasher
  • 4,427
  • 11
  • 45
  • 81
  • So you can get a nested menu to work when not using JSF? Or reversed, you can get the right structure generated with JSF when not using Bootstrap? Depending on which one you can get to work or rather, not, https://stackoverflow.com/questions/15726600/how-to-use-uirepeat-to-iterate-over-a-nested-list is a duplicate – Kukeltje Jan 15 '19 at 09:32
  • @Kukeltje, Ok! The link you have mentioned doesn't answer my question as you can see I have already nested ``. What I am asking is how to achieve multilevel nesting? The thing you are pointing out is only one level nesting. – Faizan Mubasher Jan 16 '19 at 06:37
  • Then repeat the solution (pun intended) – Kukeltje Jan 16 '19 at 09:05
  • Thanks for such a great advise! (pun intended) :P – Faizan Mubasher Jan 16 '19 at 09:49
  • So it works? (you only had three levels by default). If you actually want recursion than search for generic questions about these (always, always search for the generic problem) https://stackoverflow.com/questions/3493395/recursion-in-jsf-cforeach-vs-uirepeat. In that case your title is totally of (yes, it is your **business/functional** problem but not the technical one. – Kukeltje Jan 16 '19 at 12:15
  • otoh, maybe using http://showcase.omnifaces.org/components/tree is better (using omnifaces is good anyway... I use it a lot) – Kukeltje Jan 16 '19 at 12:21
  • @Kukeltje, ok I will try Omnifaces. As of title, I did not write this title, someone changed it :P – Faizan Mubasher Jan 16 '19 at 13:42
  • I improved it, (removed irrelevant info and put 'tags' at the end, read https://stackoverflow.com/help/tagging). But your basic question should have been 'How can I use recursion in a jsf ui:repeat or similar'. Nothing bootstrap or navbar related. A plain nested UL would have given you the same 'problem'. Then Stackoverflow would have immediately suggested similar Q/A...Cheers – Kukeltje Jan 16 '19 at 14:27

0 Answers0