Events not firing when building components programatically

edited May 2013 in Newbie Questions
I've put together a page that makes a data call to retrieve a list. It then builds some controls on the fly from the list output. If I create the controls manually, all is good. If I create the components on the fly, everything renders, but ontap does nothing. I can't see where the ontap event is even recognized. What am I missing?
   kind: "onyx.Groupbox",
   components: [
      {kind: "onyx.GroupboxHeader", style: "background-color: #480e57; text-transform: none;", components: [
          {allowHtml: true, content: hdrmessage},
          {kind: "onyx.IconButton", name: "btn" + nme, ontap: "shareStuff", src: "myimg.png", classes: "icons", style: "float: right"},
       {content: message, allowHtml: true, classes: "tglBtnsLbl", style: "border-style: none;", fit: true},



  • You need to set the owner when you create components on the fly if you want to listen for events.
    this.$.grpBoxHolder.createComponent({kind...}, {owner: this})

  • That was exactly what I was missing. Thanks for the speedy response!
  • To fill this answer out a little more:

    When you create components dynamically, their owner is default set to the component you are creating it in. Therefore, when you do

    this.$.level1.createComponent({name: "level2"...});

    you have level1 owned by this and level2 owned by level1. So, you can set the owner like @chrisvanhooser showed. I've also seen this:

    this.createComponent({name: "level2", container: this.$.level1...});

    and it works fine because the component is being created in this.
  • That's good to know. Are there advantages / disadvantages to either way?
  • @mhouse Maybe not so much an advantage/disadvantage comparison but more of a "what do you need to do" comparison. If you need the objects to actually be in the components array of a particular kind, then you want to run createComponent there instead of in a different one and changing the container.

    Otherwise, I don't think it matters much. The former way (changing owner) is by far the most prevalent in the code I've seen and written.
Sign In or Register to comment.