2013年10月30日水曜日

連載:ちょっとディープなXPages コラム2

みなさん!XPages開発していますか!?
前の投稿から、だいぶ時間が立ってしまって申し訳ありません!
ちょっとハードな仕事にハマってしまっていました・・・
今回はコラムということで、お伝えしていこうと思います。
というのも今回の内容は、2013年11月6~8日に開催される、XPages Dayでもちょっと触れる部分で、この記事をその資料としてもご提供しようという腹づもりです。

DBへのjQueryのインポート方法について

jQueryについて

jQueryは、JavaScriptライブラリの中でもデファクト・スタンダードと言ってもいいくらい、普及しているもので、非常に少ないコード量で多くのことを実行できるのが特徴です。
ご存じない方は、下記のサイトなどが参考になると思います。
jquery.com(公式サイト)
私も使い始めて、めちゃめちゃJavaScriptのコーディング時間が減りました!ほんとにもう手放せないです。(個人の感想です)
XPagesではJavaScriptライブラリとしてDojoが採用されていますが、正直なところjQueryの方が扱いやすいですし、何よりjQueryの方が普及率が格段に高いので、情報量やプラグインの数も多いのが決定的です。
そんなjQueryをXPagesで最大限に活用して楽しましょう!

jQueryのDBへのインポート

jQueryも(当然なのですが)JavaScriptで書かれているので、スクリプトライブラリに入れればいい・・・はずなのですが、何故か構文エラーになってしまいます。
そこで、少々面倒ですが下記の手順でインポートします。
※サーバーに置いて読み込ませることもできますが、実際にはそれが出来る環境は限られますからねぇ。
  1. 公式サイトからファイルをダウンロードします。

    * ver 2.x系は、IE6,7,8をサポートしていないので注意!
  2. Domino DesignerのDBで「パッケージ・エクスプローラ」を開きます。 * そのウィンドウがない場合は、メニューの「ウィンドウ」→「Eclipseビュー」→「パッケージ・エクスプローラ」から選択します。
    イメージ
  3. パッケージエクスプローラーの「WebContent」フォルダに「js」というフォルダを新しく作り、ダウンロードした .js ファイルをドラッグ&ドロップします。
    フォルダの追加は、「WebContent」フォルダの上で右クリック→「新規」→「その他」→「一般」→「フォルダー」でできます。
    イメージ
  4. 次に使用したいXPagesでリソースを指定します。この時、プロパティウィンドウの「すべてのプロパティ」→「resources」に追加します。
    [+]を押すとリソースのタイプを聞いてくるので"JavaScript"を選択します。
  5. 「clientSide」に"true"、「src」に"./js/jquery-1.10.2.min.js"(ファイル名はダウンロードしたファイルのファイル名です)と入れます。
    イメージ
これで、jQueryがブラウザでロードされるはずです。
すべての画面で使用したいのであれば、カスタムコントロールのリソースとして追加したり、Themeを利用するのも手ですね。

jQueryの使い方については…

後ほど解説していきたいと思いますが、Webで検索すると日本語の記事も多くあるので、探してみて下さいね。
海老原 賢次(EBIHARA Kenji)
リコーITソリューションズ株式会社(RICOH IT SOLUTIONS CO.,LTD.)
鹿児島ソリューション部(Kagoshima Department)

0 件のコメント:

コメントを投稿