GWT With JSON

この記事ではGoogle Web ToolkitのJavaコートからJavascriptのJSONオブジェクトをアクセスするサンプルを紹介します。

サンプル

ソース明細：

htmlファイル
<script type="text/javascript" language="javascript">
var jsonData = [
                { "FirstName" : "Jimmy", "LastName" : "Webber" },
                { "FirstName" : "Allan",  "LastName" : "Dayal" },
                { "FirstName" : "Keanu", "LastName" : "Spoon" },
                { "FirstName" : "Emily", "LastName" : "Rudnick" }
              ];
</script>

JSONにアクセスするため、用意したJavaクラス
public class Customer extends JavaScriptObject
{
    // Overlay types always have protected, zero-arg ctors
    protected Customer()
    {
    }

    // Typically, methods on overlay types are JSNI
    public final native String getFirstName() /*-{
        return this.FirstName;
    }-*/;

    public final native String getLastName() /*-{
        return this.LastName;
    }-*/;

    // Note, though, that methods aren't required to be JSNI
    public final String getFullName()
    {
        return getFirstName() + " " + getLastName();
    }
}

GWTアクセス関数
// Use JSNI to grab the JSON object we care about
// The JSON object gets its Java type implicitly
// based on the method's return type
private native Customer getFirstCustomer(int index) /*-{
    // Get a reference to the first customer in the JSON array from earlier
    return $wnd.jsonData[index];
}-*/;

使い方：
@Override
public void onClick(ClickEvent event)
{
    Customer c = getFirstCustomer(2);
    // Yay! Now I have a JS object that appears to be a Customer
    Window.alert("Hello, " + c.getFirstName());
}