Wednesday, October 5, 2016

Re: GWT RC2 with Polymer: Issue while calling click handler from Java.



On Wednesday, October 5, 2016 at 12:59:29 PM UTC+2, GAURAV GUPTA wrote:
Hi All,

I am using below code for creating my custom element, 

package com.test;

import jsinterop.annotations.JsConstructor;
import jsinterop.annotations.JsMethod;
import jsinterop.annotations.JsType;

import com.google.gwt.event.dom.client.ClickEvent;
import com.google.gwt.event.dom.client.ClickHandler;
import com.google.gwt.user.client.Window;
import com.google.gwt.user.client.ui.Button;

@JsType(namespace = "ctb")
public class CustomGWTButton{
@JsConstructor
public CustomGWTButton() {
}
@JsMethod
public Button getButton(){
//#1 java handler not working
return new Button("Test11", new ClickHandler() {
@Override
public void onClick(ClickEvent event) {
Window.alert("How are you?");
}
});
}
}


<link rel="import" href="bower_components/paper-button/paper-button.html"/>
<dom-module id="gwt-button">
<style>
</style>
<template>
<h1>Hello</h1>
<div id="buttonId"/>
</template>
<script>
Polymer({
is: "gwt-button",
attached: function(){
var obj = new ctb.CustomGWTButton();
var button = obj.getButton();
//#2 not working 
button.onclick = function(){
alert('Not Working Fine!!');
}
var line = document.createElement("p");
line.innerHTML = button;
document.getElementById("buttonId").appendChild(line);
//when I do like this, it is working
var ch = line.childNodes[0];
ch.onclick = function(){
alert('Working Fine!!');
}
}
});
</script>
</dom-module>

Below issues I am facing (RED COLOR handlers not working):
1. Click handler defined in java class not working (#1).

This is because the widget is never "attached", so the event handler is never actually added (sinkEvents is not called).
See http://googlewebtoolkit.blogspot.fr/2009/05/widget-best-practices-widget-building.html for example about the widgets lifecycle.
 
2. Then I tried to add onclick in javascript (#2) but it also didnt worked for me.

This is because 'button' is a Button widget, not a <button> DOM element (HTMLButtonElement in JS).
 
3. then I again added onclick Handler in javascrpt (#3), It worked for me. 

This is because when you did line.innerHTML=button it called the button's toString(), which happens to be calling toString() on its underlying HTMLButtonElement DOM element, which will end up as something like <button type="button">Test11</button>.
When getting that element (which will not be the button backing the Button widget in your CustomGWTButton class, but a new one, a copy with the same HTML representation), you can now add a click handler, as it'll be an HTMLButtonElement DOM element.
 
Can you please help me, How I can make work java handler #1 and #2 handler here.

Easiest would be to not mix widgets and non-widgets (DOM elements), and use Elemental or JSNI or JsInterop or whatever to attach an event listener for the click event.

--
You received this message because you are subscribed to the Google Groups "GWT Users" group.
To unsubscribe from this group and stop receiving emails from it, send an email to google-web-toolkit+unsubscribe@googlegroups.com.
To post to this group, send email to google-web-toolkit@googlegroups.com.
Visit this group at https://groups.google.com/group/google-web-toolkit.
For more options, visit https://groups.google.com/d/optout.

No comments:

Post a Comment