1 Reply Latest reply on Oct 23, 2017 9:33 AM by Max Barkley

    Dynamic menu

    Marcial Atiénzar Navarro Newbie



      I'm new on Errai. I'm trying to get an idea of how to work with UI.


      My first approach it's to create a dynamic menu with page navigation.


      I've create two classes Menu and Item:


      Captura de pantalla 2017-10-22 a las 2.20.51.png




      public class Menu extends Composite {
          private UListElement menu;
           * Añadimos un item al menú
           * @param item
          public void addItem(Item item){




      <ul class="navbar-nav mr-auto" data-field="menu">




      public class Item<T extends PageNavigation> extends Composite {
          TransitionAnchor<T> transitionTo;
          public void setLabel(String label) {




      <li class="nav-item">
         <a class="nav-link" data-field="transitionTo"></a>



      This code is used in NavBar.java


      @Page( role = DefaultPage.class)
      public class NavBar extends Composite {
          private Menu navlist;
          public void init() {
              Item planEstrategico = new Item<Plan>();
              Item proyectos = new Item<Plan>();
              Item temasPendientes = new Item<Plan>();
              Item proximasReuniones = new Item<Plan>();
              planEstrategico.setLabel("Plan estratégico");
              temasPendientes.setLabel("Temas pendientes");
              proximasReuniones.setLabel("Próximas reuniones");



      When I run this code it crashes on NavBar.java when setting label of item (planEstrategico.setLabel("Plan estratégico");)


      Is ti possible to dynamic doing things like this?

        • 1. Re: Dynamic menu
          Max Barkley Expert

          Hi Marcial,


          Your main problem is that you need to use Errai's dependency injection to get instances of your item, otherwise the templating never happens. To dynamically get instances, you have two options: inject a ManagedInstance<Item> or use the Errai bean manager.


          I suspect you will then run into problems from trying to attach Widgets as children of HTML Elements. In order for Widget events to work propertly, a Widget needs to be "attached" within the Widget hierarchy, which doesn't happen you append it's underlying element. Here is a utility you can use to do this properly.