Vaadinフレームワークの中でjQueryを使用することはできますか？

Question

VaadinはJava Webアプリケーションフレームワークなので、Vaadin JavaコードにjQuery javascriptスニペットを挿入することは可能ですか？

Answer 1

はいです。

このような独自のApplicationServlet継承したクラスを作成します。

public class MyApplicationServlet extends ApplicationServlet { 

    @Override 
    protected void writeAjaxPageHtmlVaadinScripts(Window window, 
      String themeName, Application application, BufferedWriter page, 
      String appUrl, String themeUri, String appId, 
      HttpServletRequest request) throws ServletException, IOException { 

     page.write("<script type=\"text/javascript\">\n"); 
     page.write("//<![CDATA[\n"); 
     page.write("document.write(\"<script language='javascript' src='./jquery/jquery-1.4.4.min.js'><\\/script>\");\n"); 
     page.write("//]]>\n</script>\n"); 

     super.writeAjaxPageHtmlVaadinScripts(window, themeName, application, 
      page, appUrl, themeUri, appId, request); 
    } 
} 

その後、あなたのweb.xmlでVaadinサーブレットを交換する（デフォルトはcom.vaadin.terminal.gwt.server.ApplicationServletです）：

<servlet-class>com.example.MyApplicationServlet</servlet-class> 

あなたはその後、jQueryの呼び出しを行うことができますあなたのコードに電話で：

MyApplication.getMainWindow().executeJavascript(jQueryString); 

Answer 2

もう1つのcusto ApplicationServletためmizing：

public class VaadinApplicationServlet extends ApplicationServlet { 

    @Override 
    protected void writeAjaxPageHtmlHeader(BufferedWriter page, String title, String themeUri, HttpServletRequest request) throws IOException { 
     page.write("<script language='javascript' src='http://code.jquery.com/jquery-1.8.0.min.js'></script>"); 
     super.writeAjaxPageHtmlHeader(page, title, themeUri, request); 
    } 

} 

Answer 3

あなたは@JavaScriptと@StyleSheet注釈実行するために

@StyleSheet({ 
       /* 
       * JQuery UI 
       */ 
       "vaadin://jquery/jquery-ui-1.9.2.custom/css/ui-darkness/jquery-ui-1.9.2.custom.min.css", 
}) 

@JavaScript({ 
       /* 
       * JQuery 
       */ 
       "vaadin://jquery/jquery-1.11.1.min.js", 

       /* 
       * JQuery UI 
       */ 
       "vaadin://jquery/jquery-ui-1.9.2.custom/js/jquery-ui-1.9.2.custom.min.js", 
}) 

public class MyUI extends UI { 
... 
} 

を使用することができます。

JavaScript.getCurrent().execute("...javascript code here...") 

はより大きなスクリプトには注意してください。 vaadinアノテーションを使用してjavascriptを追加すると、パフォーマンスが非常に悪くなります。 htmlヘッダーにスクリプトを手動で挿入する方が効果的です。