Sample code for a GWT Popup Anchor that links to an External URL

Do you need to have an anchor on your GWT page that pops up a window that navigates to an external/arbitrary URL? I’m your guy.

I have an easy solution that involves adding a ClickHandler to your anchor. The image below shows the result. After clicking the Redeem Now button (uses my ImageAnchor widget from the previous post), a window pops up and navigates to an external URL.

View.java Sample Code

In your view file, declare your anchor. I use UiBinder so I have the UiField annotation, but you don’t need it if you aren’t using UiBinder.

@UiField
Anchor redeemButton;

Define a JavaScript function in your view:

public static native void popupAnchor(String url) /*-{
    window.open(url, 'Redeem Rewards', 'width=1024,height=900,scrollbars=yes');
    return false;
}-*/;

Create a method that attaches a ClickHandler to your anchor:

private HandlerRegistration updateAnchorClickHandler(Anchor anchor, HandlerRegistration existingClickHandler, final String rewardsURL) {
    // We will be updating the URL from time to time from a Timer
    // Make sure we aren't adding multiple handlers to the same anchor
    if (existingClickHandler != null) {
        existingClickHandler.removeHandler();
    }
    HandlerRegistration newHandler = anchor.addClickHandler(new ClickHandler() {
        public void onClick(ClickEvent event) {
            popupAnchor(rewardsURL);
        }
    });
    return newHandler;
}

Declare a handler registration as a class member variable. This holds on to the ClickHandler’s registration to the anchor. This allows us to remove it in case the popup url needs to be updated.

private HandlerRegistration redeemHandlerRegistration = null;

Finally, whenever you want to assign a new/updated popup URL for the anchor, simply call your method:

String rewardsURL = whatever you want

redeemHandlerRegistration = updateAnchorClickHandler(redeemButton, redeemHandlerRegistration, rewardsURL);

 

 

Technorati Tags: gwt,popups