How to invoke method from outside of a Polymer component when you’re in in a *.zul file from ZK Framework?
Polymer Element:
<script src="https://www.polymer-project.org/components/webcomponentsjs/webcomponents.js"></script>
<link rel="import" href="https://www.polymer-project.org/components/polymer/polymer.html">
<dom-module id="my-component">
<template></template>
<script>
Polymer({
is: "my-component",
alert: function() { alert("alert!"); }
});
</script>
</dom-module>
Sample usage:
<zk xmlns:n="native" xmlns:w="client">
<n:my-component id="myComponent"></n:my-component>
<button id="someButton" w:onClick="document.querySelector('#myComponent').alert()">Click Me</button>
</zk>
How to attach event listener to custom Polymer component and propagate event to server side using zAu?
The event is fired inside of a Polymer element using fire() method:
this.fire('close-finish', "more detailed data", { bubbles: false });
Native JavaScript below adds a new event listener to the component. Event handler executes zAu engine command to forward the event to the server.
<n:script xmlns:n="native">
document.querySelector('my-component').addEventListener('close-finish',
function() {
zAu.send(new zk.Event(zk.Widget.$('$cancelButton'), 'onClick', 'finish', {toServer:true}));
});
</n:script>