Search code examples
javascriptpolymerlistenerevent-bubbling

Passing Event from Parent to Child Element (Polymer)

I am trying to have a parent element call a function from it's child. In the parent's script I have:

_handleFunction: function() {
    console.log("Button Pressed!");
    this.fire('send-update');
}

And then in it's child 

listeners: {
    'send-update': '_update'
},

_update: function() {
    this.$$('#element').innerHTML = 0;
}

But the child is not firing.

I have successfully passed a function up the chain using the design pattern. Is it possible to pass back down using the same pattern?

Solution

  • The easiest way to invoke _update() function of your child element is to call it directly from the parents _handleFunction():

    this.$.child._update();

    where the child element has to have an HTML id of 'child'.