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.

Howdy, Stranger!

It looks like you're new here. If you want to get involved, click one of these buttons!