1 Reply Latest reply on Feb 10, 2015 3:07 PM by Christian Sadilek

    Errai UI instanciate element with Event dynamically

    Julien GUIBERT Newbie

      Hello.

       

      With Errai 3.1.0, I try to create dynamically an element (ex: Button) with an Event (ex: ClickEvent)

       

      My code :

       

      @Templated("MyWidget.html#my-widget")

      public class MyWidget extends Composite {

       

           @Inject

           @DataField

           private Button button_ok;

       

           private Button button_ko;

       

           @PostConstruct

           public void init() {

                button_ko = new Button("BUTTON_KO");

       

                // add ClickHandler to button_ok and button_ko

                button_ok.addClickHandler(new MyClickHandler());

                button_ko.addClickHandler(new MyClickHandler());

       

                // add button_ko to DOM

                this.getElement().appendChild(button_ko.getElement());

           }

      }

       

      The ClickEvent is OK for button_ok, but KO for button_ko.

       

      How i can do ?

       

      Thanks a lot!

        • 1. Re: Errai UI instanciate element with Event dynamically
          Christian Sadilek Master

          Hi Julien,

           

          There are a couple of ways to do this but simply adding the DOM element is not enough. Since you want to add widgets dynamically I would add a placeholder DIV to the template i.e. <div id="dyn"></div>, then in your @Templated class do this (following your example):

           

          @Templated("MyWidget.html#my-widget")
          public class MyWidget extends Composite {
               ...
          
               @Inject
               @DataField
               private HorizontalPanel dyn;     
          
               @PostConstruct
               public void init() {
                    Button button_ko = new Button("BUTTON_KO");
                    button_ko.addClickHandler(new MyClickHandler());
                    dyn.add(button_ko);
               }
          }
          

           

          Cheers,

          Christian