Hook GWT method to Export button menuitem in GWT HighCharts

0
votes

I'm having trouble hooking a GWT method to the onclick method of a menuitem in the export button on a GWT HighCharts chart.

I've successfully added a custom menu item to the export button, but dont know the syntax for setting the onclick method. I've tried:

 setOption("onclick", "window.alert('Test')");

and

setOption("onclick", "function() { window.alert('Test') }");

but I get the following error:

Uncaught JavaScript exception [TypeError: a.onclick.apply is not a function]...

So, it is trying to invoke whatever Im putting in the onclick string, but apparently it is not the right syntax I'm using. I have been thinking about JSNI, but I am not exactly sure how I would go about and do that. Can anyone help?

EDIT:

Obviously, in the above example, Im trying to show an javascript alert, but I want to call a GWT instance method if possible. (Static methods would be ok, too).

EDIT 2:

This is the code for my menuitem in the Export button:

private class ExportButtonMenuItem extends Configurable<ExportButtonMenuItem> {

    public ExportButtonMenuItem(String name, String type) {
        setOption("text", name);

        if (type.equalsIgnoreCase(EXPORT_EXCEL)) {
            // setOption("onclick", "window.alert('Test')");

            // does not work!
            setOption("onclick", new Command() {
                @Override
                public void execute() {
                    GWT.log("export!!!");
                }
            });
        }
    }
}

and this is how the menu item(s) are added to the chart:

chart.setOption("/exporting/buttons/exportButton/menuItems", 
    new ExportButtonMenuItem[] { 
        new ExportButtonMenuItem("Download PNG", ExportButtonMenuItem.EXPORT_PNG), 
        new ExportButtonMenuItem("Download JPEG", ExportButtonMenuItem.EXPORT_JPEG), 
        new ExportButtonMenuItem("Download PDF", ExportButtonMenuItem.EXPORT_PDF),
        new ExportButtonMenuItem("Download SVG", ExportButtonMenuItem.EXPORT_SVG),
        new ExportButtonMenuItem("Download Excel", ExportButtonMenuItem.EXPORT_EXCEL)});

EDIT 3:

In the HighCharts JS source (exporting.js), the onclick method for the menuitem is invoked like this:

div[hasTouch ? 'ontouchstart' : 'onclick'] = function () {
    hide();
    item.onclick.apply(chart, arguments);
};

When apply is invoked, I get this error:

     [java] Uncaught JavaScript exception [TypeError: item.onclick.apply is not a function] in http://127.0.0.1:8888/js/modules/exporting.src.js, line 467

I have been trying to override the onclick function, but still no success...

2
gwthighchartshighstockjsni

2 Answers

0
votes

Pass Command interface instead of String 

Command sayHello = new Command() {
   public void execute() {
     Window.alert("Hello");
   }
 };
 sayHello.execute();
0
votes

Event handlers are not encompassed as options in the HighCharts API, but you can simply use plain GWT to attach such handler to the wrapping widget:

widget.addClickHandler(new ClickHandler() {

    @Override
    public void onClick(ClickEvent event) {
        Window.alert("clicked!");
    }
});