slack

テクてく Lotus 技術者 Slack に参加しよう!

2010/01/26

Java クラスのサンプルコードを SSJS へ応用する方法

Xpages の開発中、サーバーサイドの JavaScript をどのように記述するか調べたくても適当なサンプルスクリプトも非常に少ないのが現状です。
これは何も日本語に限ったことではなく英語でもまだ不十分のようです。
JavaScpirt のサンプルとして、既存のJava/CORBA クラスのサンプルを利用する方法が Lotus Notes and Domino Application Development wiki に掲載されていましたのでご紹介したいと思います。原作は同 wiki の「Converting Java sample code to JavaScript code」です。

ここで取り上げられている例では ColorObject クラスの getBlue プロパティを題材にしていますが、おおよそ他のメソッドやプロパティの例でも使用できると思います。
では見ていきましょう。

import lotus.domino.*;
public class JavaAgent extends AgentBase {
  public void NotesMain() {
    try {
      Session session = getSession();
      AgentContext agentContext = session.getAgentContext();
      // (Your code goes here) 
      Database db = agentContext.getCurrentDatabase();
      View view = db.getView("Main View");
      ColorObject color = session.createColorObject();
      color.setNotesColor(view.getBackgroundColor());
      System.out.println(
      "Blue value of Main View background = " + color.getBlue());
    } catch(Exception e) {
      e.printStackTrace();
    }
  }
}

まず、import や class ステートメントは必要ありません。
そして try 節を取り除きます。(try は後述で説明)

Database db = agentContext.getCurrentDatabase();
View view = db.getView("Main View");
ColorObject color = session.createColorObject();
color.setNotesColor(view.getBackgroundColor());
System.out.println(
"Blue value of Main View background = " + color.getBlue());
では上から見ていきます。
最初の行のセッションを取得しているコードは不要です。
XPages の JavaScript はエージェントのコンテキストで動作しているわけではありませんので、この行も削除します。このようにサンプルのコードがアプリケーション、サーブレット、またはアプレットのコンテキストで動作する場合は同様に削除しても構いません。

ではどうやって現在のデータベースを取得するのでしょうか?
XPages の JavaScript は現在のデータベースを表す「database」というグローバル変数を提供しています。
そこで先頭の行をこの変数を使うように書き換えます。Viewvar に置き換えます。
var view = database.getView("Main View");
ColorObject color = session.createColorObject();
color.setNotesColor(view.getBackgroundColor());
System.out.println(
"Blue value of Main View background = " + color.getBlue());
補足ですが、次のコード例のように変数の後にコロンをつけてコメントすることができます。
var view:NotesView = database.getView("Main View");
同様に ColorObject の代わりに var を使用します。
session」の文法はそのまま通用しますが、意味合いが少し異なります。
Java コードでは session は getSession によって返された変数ですが、JavaScript では session は現在のセッションを現すグローバル変数のひとつです。
したがってコードは次のようになります。
var view = database.getView("Main View");
var color = session.createColorObject();
color.setNotesColor(view.getBackgroundColor());
System.out.println(
"Blue value of Main View background = " + color.getBlue());
view と color はセットされているので次の行は何も変更する必要はありません。
ここでの JavaScript の文法は Java とまったく同じです。
最後の行は調整が必要です。JavaScirpt は System オブジェクトを認識しません。
getBlur() の値をコンソールへ返したいのであれば次のようになります。
var view = database.getView("Main View");
var color = session.createColorObject();
color.setNotesColor(view.getBackgroundColor());
print ("Blue value of Main View background = " + color.getBlue());
しかし当然 JavaScript はある制御のための値が必要ですから return キーワードを使って値を返すことになります。
var view = database.getView("Main View");
var color = session.createColorObject();
color.setNotesColor(view.getBackgroundColor());
return "Blue value of Main View background = " + color.getBlue());
コード内で発生したエラーを catch したい場合は、下のように記述することができます。
JavaScript でステートメントが複数になっている場合にはセミコロンを取り除くことに注意してください。
try {
 var view = database.getView("Main View")
 var color = session.createColorObject()
 color.setNotesColor(view.getBackgroundColor())
 return "Blue value of Main View background = " + color.getBlue())
} catch (e) {
 return e.message
}

また次のサンプル JavaScript はエージェントの名前をリストで返す例です。
var agents = database.getAgents().iterator();
var list = "";
while (agents.hasNext()) {
 list = list + agents.next().getName() + "\n";
}
return list
最後は getFirst...getNext... の繰り返しを使って処理を行い null で終了する方法です。
DATABASE は固定値として定義されていることに注意してください。
var DATABASE = 1247;
var out = "";
var dir = session.getDbDirectory("");
var db = dir.getFirstDatabase(DATABASE);
while (db != null) {
 out = out + db.getFileName() + "\n";
 db = dir.getNextDatabase();
}
return out;

2010/01/20

Notes 8.5.2

Notes 9 の話も待ち遠しいですが、現行のメンテナンスリリースとしての 8.5.2 の概要が徐々に Lotusphere 2010 で明らかになっているようです。

時期メンテナンスリリースの 8.5.2 については「Notes 8.5.2 First Showing @ Lotusphere」{Original Source}で紹介されています。多少内容が意訳になり本来のものと異なるかもしれませんが、抜粋して訳します。

  1. XPages を編集する際ソースコードビューにコントロールをドラッグ/ドロップできるようになる
  2. Xpages が他の設計同様に一般アクセス(Public Access)ユーザーからアクセスできるようになる
  3. データソースからフィールドをドラッグして XPage に貼付けるとき、そのフィールドはテキストボックスのみでしたが、フォーム上のデータタイプ(日付やリッチテキストなど)に応じたタイプになります。
  4. データソースからフィールドをドラッグして XPage に貼付けるとき、フィールドがインポートされる前に順番を変更することができます。
  5. XPage のコントロールとしてラジオとチェックボックスのグループはネイティヴとして表示されることになりました。いままではコンボボックスしかなく、ラジオ/チェックボックグループのコントロールにする場合には初めにコンボボックスを貼付けてマニュアルで変更しなければなりませんでした。
  6. データベース(a database)を署名するのにデザイナーから右クリックのアクションで行うことができるようになります。
  7. ほとんどのコントロールで dojo のタブが追加され、デザイナーの UI から dojo のプロパティをセットできます。
  8. CKEditor がリッチテキストエディタのデフォルトになります。
  9. データソースのスクリプトは Eclipse のエディタを呼び出します。@Formula のエディタに関してはまだできません。
  10. 「新規アプリケーション」ダイアログは再デザインされ、ワーキングセットをアサインすることもできるようになります。
  11. XPage のコンポーネントを「ライブラリ」に追加することができ、他のアプリケーションで共有することができます。
  12. 一連の「RESTful API」が利用可能になり、開発者があらゆる面で XPage アプリケーションを拡張することができるようになります。たとえば、オリジナルの新しいコントロール、データドライバー、バリデーションを作成するなど。
上記の中には、私も実感して改善してほしいと思ったことがあったのでうれしい限りです。
原文で YES とか Yes, yes, yes で書かれている内容は本当にありがたい機能だと思いませんか?

こうして訳してきましたが、私自身が実際に聞いた話を書いているわけではありませんので、今の段階では予定という感じで眺めていただければ良いかと思います。

Lotusphere 2010 のセッションより

今週は Lotusphere 2010 真っ盛りですが、ここ数年ではブロガーたちの活躍?によって OGS の様子がリアルタイムで書き込みされていたり、Twitter を使ったりでどんな様子かを想像するのが楽しみになってきています。
これから様々なセッションが行われますが、XPages に焦点をあてると約 10 ぐらいのセッションがあるでしょうか。
今回はその中からMatt White 氏と Tim Clark 氏のふたりで行われた
SHOW112「Building an XPages App from Start to Finish Session
のセッション内容が既にダウンロードできるようになっています。
いわゆる DVD のレンタルショップ向けのアプリケーションをイメージして開発を一から体験できるようになっています。
それぞれ両名のサイトからダウンロードできるようになっています。どちらのサイトからでも入手できます。
Tim Clark 氏「SHOW 112 – resources and file download
Matt White 氏「SHOW112 Building an XPages App from Start to Finish Session Downloads

ダウンロードのされたアーカイブには
  • プレゼンテーションの PDF ファイル
  • 作業前のサンプル・アプリケーション
  • アプリケーションの完成版
  • コードの snippets

があり、プレゼンテーションの資料を見てアプリケーションを開発して行けるようになっていますので Xpages のいろはを知りたい方にはとてもよい教材といえます。

プレゼンテーションのアジェンダは

  • アプリケーションの概要
  • Xpages とは
  • レイアウトと UI
  • アプリケーション内で利用するデータについて
  • データの作成/読み込み/更新/削除
  • 質問
  • 補足

で構成されています。
全ページ 265 ページになりますので、初心者用とはいえかなりの量と言えます。

最後の補足では Cool Stuff として小ネタもありますので、基本を押さえている方でも一度目を通すといいと思います。

XPages Tutorial Part 54 : 終わりに

The End... {Original Source}

このシリーズの最初を振りかえると、当初のアプリケーションの目的についてお話しした内容は XPages ベースの電話帳を作成すること、2 番目に ノーツクライアントアプリケーションを Java アプリケーションのようなルックアンドフィールにすること、3 番目はエージェントを作成しこの電話帳とドミノディレクトリを同期させることでした。

このシリーズで達成できたことは、当初の目的の 1 番目で、XPages 電話帳アプリケーションを作成し、IBM の 他の製品でおなじみの OneUI のルックアンドフィールを使って美しいアプリケーションに仕上げました。そして、ユーザーにはスタッフを参照する機能、編集できるロールを持つユーザーにはロケーションとスタッフの情報をメンテナンスできる機能を作成してきました。

このシリーズ全体を最初から取り組み、実際アプリケーションを作成してきたのであれば XPages のあらゆるエリアを見てきたことになります。たとえば、用意されているコントロール、自身で作成するカスタムコントロール、また簡単なコードを書くだけでそれほど JavaScript を学習する必要はなく、いままでの式や LotusScript のスキルを応用して JavaScript が書けることもわかりました。

皆さんがこのシリーズを楽しんでいただけたことを、また XPages のパワーがほんの少しでも皆さんにご理解いただけたことを願っています。このシリーズはサンプルで提供されているテンプレートから私自身がたくさん学んできたことや自身で発見したことを皆さんにもご紹介してきました。
自信を持って言えますが、これからの私のドミノの Website はこれまでの手法ではなく XPages を使用したものになることでしょう。

電話帳アプリケーションの最終版は OpenNTF のここからダウンロードできます。

Enjoy!

XPages Tutorial Part 53 : Search Results XPage の完成

Building The Search Results XPage {Original Resource}

検索バーは完成し、何かを検索しようとするとエラーが表示されます。なぜかと言えばまだ検索の結果を表示させるページを作成していないからです。今回は検索結果表示用の XPage の作成と表示方法を見ていきます。

既存の XPage の中からコピーペーストして、名前を「Search」とします。今回は「Location」XPage をコピーすることにします。同じように「content_Location」カスタムコントロールをコピーして、「content_Search」に名前を変更してください。
その後、再度「Search」XPage に戻って、ソースビューから「content_Location」を「content_Search」に変更してください。
このように基本的なカスタムコントロールでアプリケーションのレイアウトだけを構成したページを再利用すると新しい部分を追加していくだけですばやく作業に取り掛かれます。

では「content_Search」カスタムコントロールを開いてください。検索結果を表示させる前にいくつかやってかなければならないことを済ませましょう。
まずはスクリーン上部のロケーションに関する情報とアクションバーを表示する部分をを取り除きます。
スクリーンにはページャと表(繰り返しの内部も含んで)だけが残るようにします。

カスタムコントロールのデータタブで「locationDoc」のデータソースを削除し、「peopleView」のデータソースを残すようにしてください。

またリソースセクションからサーバーサイドスクリプトライブラリを削除し、すべてのプロパティのセクションから「beforePagesLoads」のスクリプトを取り除きます。

これでこのページに対してきれいに掃除されたのであとはデータソースを指定し、検索で使用できるようにします。

このまま「すべてのプロパティ」で「データ」セクションを開きます。今回の検索がビューの中のすべての文書を対象とするので、指定されている categoryFilter を取り除きます。

次に同じセクションの下のほうにある「search」プロパティに移動します。ここで値の計算をするためダイアモンドをクリックし以下のコードを入力します。



ではこのカスタムコントロールを保存して、検索機能を試してみましょう。以下は「Smith」という名前を検索した結果になります。

このページではスタッフのロケーションを表のどこかに表示したいと思うかもしれませんが、いづれにしても検索の機能は以上で完成です。

XPages Tutorial Part 52 : 検索結果の取得とその表示

Getting And Displaying The Search Results {Original Source}

検索バーは徐々に形が出来上がり、データベースに全文索引が作成されていればスクリーン上に表示されます。
デフォルト値が編集ボックスに設定され、クリックすると消えるようになっています。
またビュースコープも設定しました。
今回は編集ボックスとリンクに対して検索結果を表示するページがどれかを設定し、Part 53 ではその結果を表示させる XPage を新たに作成していきます。

では簡単な方からやっていきますので、リンクから見ていくことにします。
あとで編集ボックスにもそのコードを再利用することができます。
「layout_PlaceBar」カスタムコントロールを開き、検索エリアのリンクコントロールを選択してください。

ユーザーがこのリンクをクリックしたら SearchResults.xsp という XPage を開き、検索の値を渡すようにしたいと思います。
これをするためにはリンクの onclick イベントを作成します。
イベントタブに切り替えて、onclick イベントを選択し「アクションの追加」をクリックしてください。
ここでのアクションは「ページを開く」です。

ここで開きたいページは計算の結果になりますので、ビュースコープを使用して計算させてみましょう。開くページの名前の引数として、ダイアモンドをクリックし、次のコードを入力します。
"Search.xsp?searchValue=" + viewScope.searchValue;
リンクに対しては以上です。
編集ボックスはもう少し複雑になってきます。
リンクをクリックしなくてもユーザーがエンターキーを押すと検索が始まるようにしたいと思います。

編集ボックスコントロールを選択して、イベントタブに切り替えてください。
対象のイベントは onkeypress イベントです。

「ページを開く」アクションは、先ほどリンクコントロールで行ったものとまったく同じコードをサーバーサイドのイベントとして記述します。
このままだとユーザーが何か一文字でも入力すると起動されてしますので、エンターキーが押されたかどうかの判別が必要になります。そこで、クライアントサイドのイベントを書かなければなりません。

同じ「onkeypress」イベントの中の「クライアント」タブに切り替えて次のコードを入力してください。

このコードはどのキーが押されたか確認し、エンターキーでない場合は false を返し、エンターキーである場合には true を返します。これによってユーザーがエンターキーを押し、制御をサーバーサイドのイベントに移しページを開くようになります。

これで検索の値を処理し、search.xsp という XPage に行くように設定できました。次回はそのページを作成したいと思います。

XPages Tutorial Part 51 : 検索バーにファンクションを設定する

Giving Function To The Search Bar {Original Source}

検索バーの基本は設計できましたので、実際の機能を追加していくことにします。
「layout_PlaceBar」カスタムコントロールを開いてください。

データベースの検索機能は全文索引が作成されている場合にだけ動作します。全文索引が作成されていない場合には検索バー全体を表示しないようにしたいと思います。
これを行うためには検索ボックスを含むパネルの表示を値の計算で判断させます。
ではパネルを選択し(ソースビューから選択すると簡単です)、「表示」プロパティのダイアモンドをクリックします。値の計算を選択し JavaScript のエディタを開き「database.isFTIndexed();」を入力してください。
このファンクションは全文索引が作成されていれば「true」、作成されていなければ「false」を返します。

検索用の編集ボックスに対して、このフィールドが検索ボックスだということをユーザーに分かってもらうためのヒントを提供したいと思います。
今回は「Search...」という言葉をデフォルト値として追加し、編集ボックスの中をクリックするとこのデフォルト値が消えるようにします。

編集ボックスを選択し、「すべてのプロパティ」セクションに切り替えてください。
「データ」カテゴリの中にデフォルト値を設定する場所があります。

デフォルト値を消すには「onfocus」イベントを使います。
イベントタブに切り替えて「フォーカス」カテゴリから「onfocus」イベントを探してください。
このイベントはユーザーのブラウザ上で動作するようにしたいため「クライアント」のスクリプトエディタで記述することになります。その JavaScript は下記になります。
document.getElementById("#{id:mySearchValue}").value = "";
document はブラウザで表示している現在の文書を参照します。
.getElementById でその ID 名で文書のエレメントにアクセスできます。
実行に生成されるまでエレメントの名前が分からないので、編集ボックスの ID 名が正しく設定されるように #{id:mySearchValue} を使用します。(これは mySearchValue の XPages 上の ID です)。
.value  "" はブランクを設定するという意味です。

ここまでのコードは非常に簡単なものです。フィールドの中をクリックするとそこにあったものを削ブランクに置き換えて削除するものです。
しかし、ここで問題になるのは何かの文字を入力した後で、ほかのフィールドに移りまたここに戻ってくると先ほど入力した文字は消えてしまいます。
この問題を解決するには onfocus イベントに次の JavaScript に変更してください。
var me = document.getElementById("#{id:mySearchValue}");

if (me.value === "Search...")
{
me.value = ""
}
このコードでデフォルト値がフィールドにある場合に限ってクリアするものです。このほうがエンドユーザーにとっても良さそうです。

ではエンドユーザーが入力した内容はどこに格納するのでしょうか?
スコープの値を利用するのです。
編集ボックスのプロパティで、データタブを選択してください。
値を取得しどこかに格納するためには、この編集ボックスと何かをバインドしなければなりません。
今回は viewScope の変数として値を保管したいので、「詳細」を選択し、使用を「スコープ変数」とし ビュースコープ (「表示の範囲」)を指定します。
最後に変数名を指定してください。今回は「searchValue」とします。

残る最後の機能はユーザー検索ボックスに文字を入力し、エンターキーを押されたら必要なアクションを実行させることです。これは次回に行うことにします。

XPages Tutorial Part 50 : 検索機能の作成

Creating A Search Function {Original Source}

現在の電話帳アプリケーションは当初設定した目的を達成し完成している状態です。
当初設定した目的のうち残り 2 つに関しては XPages に関連した項目ではないのでこのシリーズでは取り扱いません。
これを完成として OpenNTF にリリースできる状態ではありますが、その前にもうひとつだけ機能を追加しておきたいと思います。

それは XPages アプリケーションに検索機能を追加することです。この機能ではユーザーが検索したい言葉を入力しボタンを押すと検索のプロセスを始めるものです。検索バーを画面の右側に追加したいと思います。

タイトルバーのエリアに検索バーを追加しようと思いますが、ユーザーの視点からアプリケーションのタイトルの一部ではないことはもちろん、サイドバーの一部ではないこと、また現在表示されているデータから検索をしているのかアプリケーション全体を検索しているのかが分かるような場所がふさわしいと思います。

では検索バーを追加していきましょう。「layout_PlaceBar」カスタムコントロールを開き、画面右側のコントロールペインから新しいパネルをドラッグインしてください。
ソースビューに切り替え、このパネルの記述をページの上部移動させます。
ちょうど DIV の下に配置し、下のように名前を付けて「lotusSearch」のスタイルクラスを指定します。


このパネルの中にもう 2 つのコントロールをドラッグインします。
編集ボックスコントロールとリンクコントロールです。
編集ボックスコントロールには「mySearchValue」という名前を指定し、幅を 200px に指定します。


リンクコントロールには、ラベルには分かりやすい名前を入力しておいてください。


ラベルに関しての理由は、文字の代わりにイメージを指定したいからです。
このイメージは、イメージリソースから指定するものです。お好きなイメージをアプリケーションにインポートして指定してください。


検索バーのレイアウトのソースは次のようになります。

パネルコントロール全体に対して右端に来るように top と right のマージンをしたのに注意してください。

次回はこれらのコントロールにイベントを追加することをやっていきます。

XPages Tutorial Part 49 : LocationEdit XPage を完成させる

Building The LocationsEdit XPage {Original Source}

今回は以前、Part 22 と Part 23 で行ったことですので簡単に済ませることができると思います。
これまで電話帳を編集するための特別なページを作成し、Web 上からロケーション文書を作成、編集、削除できるようにしてきました。

「content_LocationAdmin」カスタムコントロールに戻ってください。ビューコントロールの最初の列の値をリンクとして表示されるようにしました。

そしてビューコントロール全体に対して、選択した文書を開くページとして「LocationEdit」XPage を指定しました。

すでに Part 46 で「LocationEdit」XPage は作成してあり、現在はレイアウトのためのカスタムコントロールとメインのコンテンツの「content_LocationEdit」カスタムコントロールがブランク状態であるだけです。
今回はこのカスタムコントロールを完成させていきたいと思います。では「content_LocationEdit」カスタムコントロールを開いてください。

まず最初にやることはデータソースを指定することです。ページのメインのプロパティを見て、データセクションに切り替えてください。
Lotus Domino 文書に対する新しいデータソースを追加し、下のように設定します。

データソースが追加されるとデータペインでラベルとフィールドの表を作成することができます。
右側のコントロールペインの上部にデータペインに切り替えるための下向きの 2 つの小さな矢印を確認してください。

データソースからすべてのフィールドを選択してカスタムコントロールの中にドラッグインしてください。

フォーム上の編集ボックスに対して妥当性検査をつけたい場合には Part 33、34、35 を参照してください。ここでは「Location」フィールドは必ず入力されていなくてはならないという検査になるでしょうか。

あと残っているのは文書を保存する、編集するというボタンを完成させることです。
他の Part でご紹介した「content_Person」カスタムコントロール上のアクションバーやボタンをコピーして貼り付け時間の節約をして「Save」と「Cancel」ボタンを仕上げてください。

では、カスタムコントロールを保存し、ブラウザでロケーションの編集をプリビューし、ボタンやフィールドが正しく表示されているか確認してください。

2010/01/19

XPages Tutorial Part 48 : チェックボックスをアクションにリンクさせる

Linking Checkboxes To An Action {Original Source}

前回はビューコントロールの横にチェックボックスを表示させました。
今回はこのチェックボックスで選択されたすべての文書を削除するボタンとリンクさせたいと思います。
では「content_LocationAdmin」カスタムコントロールを開いてください。最初にアクションバーを作成し「Delete Documents」というボタンを配置します。
以前アクションバーを作成したのと同様にこのコントロールに以下のようなソースコードでアクションバーを作成します。
<xp:panel id="panel1" styleClass="lotusActionBar lotusBtnContainer">
<xp:link escape="true" text="New Location" id="link1" outerStyleClass="lotusBtn lotusBtnAction lotusLeft">
<xp:eventHandler event="onclick" submit="true" refreshMode="complete">
<xp:this.action>
<xp:actionGroup>
<xp:openPage name="/LocationEdit.xsp" target="newDocument" />
</xp:actionGroup>
</xp:this.action>
</xp:eventHandler>
</xp:link>
<xp:link escape="true" text="Delete Locations" id="link4" outerStyleClass="lotusBtn lotusBtnAction lotusLeft" />
</xp:panel>
「content_LocationAdmin」のビューパネルタグの上にこのコードを貼付けてください。
設計ビューに切り替えると 2 つのリンクを持つパネルが確認できるでしょう。
最初のリンクは「New Location」、2 番目は「Delete Locations」です。最初のリンクには既にコーディングをしてありますので、2 番目のリンクのコードを記述しましょう。


ビューで選択された文書を削除する方法には 2 つあります。ひとつは「シンプルアクション」を使う方法、もうひとつはスクリプトで行う方法です。今回は 2 つ見ていくことにしましょう。

シンプルアクションを使う方法では「Delete Locaitons」リンクをクリックし、イベントタブに切り替えます。onclick イベントを選択してシンプルアクションを選び、アクションの追加を行います。

分類では「文書」を選びます。アクションは「選択文書の削除」です。
そしてチェックボックスがチェックされたかどうかを確認したいビューコントロールがどれかを指定します。またボタンがクリックされたときに表示される確認のテキストを入力することも可能です。

では保存してブラウザで確認してみましょう。

もしユーザーが何も選択せずクリックすると標準のメッセージが表示され、ユーザーに少なくとも 1 つ以上の文書を選択するよう促します。

ほとんどのアプリケーションではこの方法で十分だと思いますが、稀にこれ以上のことを要求されることがあります。たとえば、電話帳アプリケーションは、削除使用するロケーションにまだスタッフが指定されている場合、そのロケーションに人がいなくなるまで削除をブロックするといったロジックが必要になったり、そのロケーションに所属するスタッフの情報も同時に削除してしまうといったケースが考えられます。

スクリプトを使用した方法では、選択した文書に対して単に削除するだけでなくもっと多くのオプションを採用することが可能です。

ビューコントロールの中でどの文書が選択されているかを把握するのに同じビューコントロールの名前に対して .getSelectedIds() のメソッドを使います。このファンクションは選択されたすべてのエントリの文書 ID を配列で返し、配列の値をループさせて読み込むことで文書を処理することができます。

では「Delete Locations」のリンクを再度クリックし、イベントタブに切り替えてください。
今回は onclick イベントでスクリプトエディタを選択しサーバーサイド JavaScript を記述します。
var viewPanel=getComponent("viewPanel1"); 
var docIDs=viewPanel.getSelectedIds(); 
for(i=0 ; i  <  docIDs.length ; i++){ 
var docId = docIDs[i]; 
var doc:NotesDocument = database.getDocumentByID(docId); 
 // Process selected documents here 
}

最初の行は .getComponent() ファンクションを使ってビューコントロールへのアクセスを設定します。これは XPages 設計のもつ強力な機能のひとつで、実行時にコントロール上のプロパティに対して get や set でアクセスすることができます。
例えば、このファンクションを使うと実行時に繰り返しで表示される行の数を変更することもできるのです。
今回のケースではビューコントロールに対して行います。

2 行名は getSelectedIds() ファンクションを使って、最初の行で作成した変数に文書 ID の配列を入れています。
3 行名はループです。
4 行名はループでの現在のエントリの文書 ID を保持し、5 行目で get DocumentByID() ファンクションで実際の文書を取得しています。

この JavaScript にも LotusScript で培ったスキルを活かすことができます。
仮にここで単に文書を削除するだけであればループの中に「doc.remove(true);」と入れるだけです。

このように選択した文書に対して処理を行う方法をどちらにするかは、どれだけの制御が必要か、つまりシンプルアクションを採用できるのか、バックグランドで処理がもっと必要かどうかによります。

XPages Tutorial Part 47 : ロケーションをリストするためのビューコントロール

Using A View Control To List Locations {Original Source}

ロケーションの一覧をホームページに表示させる際、表の中に繰り返しコントロールを使ってきました。これは表の中のそれぞれの行にマウスを合わせると色を変えたりする効果を与えたり、行の中のどの行でもいいからクリックすると、その文書をクリックしたと認識させることができました。
今回は同じように情報を一覧表示させることができる「ビュー」コントロールをご紹介します。ではどのように設定していくかを見ていきましょう。

「content_LocationAdmin」カスタムコントロールを開いてください。
ここにはまでひとつのパネルしか存在しないブランクの状態です。ここのパネルに「ビュー」コントロールをドラッグインします。「ビュー」コントロール右側のコンテナコントロールにあります。

ドラッグしマウスを離すとダイアログボックスが表示されデータソースをビューコントロールへリンクさせることができます。
現在のアプリケーションから「vw_locations」ビューを選択します。
その下にこのビューで利用できるすべての列が表示されます。
もし XPage 上で表示させたくない列があればチェックをはずすだけです。

では OK をクリックし、ページャが既に組み込まれているビューコントロールを確認します。このカスタムコントロールを保存しブラウザでプリビューします。

この電話帳を編集できるユーザーには、ビューに表示されているロケーション文書をクリックすると自動的に編集モードでページが表示されるようにしたいと思います。
また各行にチェックボックスを追加して、一度に複数の文書を削除できるようにもしていきます。
では先ほどのビューコントロールに修正をしていきましょう。
まず、最初の列を選択し、ビューの列プロパティを見ます。
列表示のいくつかのプロパティがあると思います。

「チェックボックス」にチェックを入れ、「列の値をリンクとして表示する」にチェックを入れ、文書のオープンモードを上のように指定します。
この状態でプリビューすると表示はこのようになります。


リンクをクリックしたときに開く際の XPage を指定します。「ビュー」コントロールに戻り、「実行時に、次を使用して選択した文書を開く」に下のように指定してください。

ビューコントロールの表示をもう少し良くするために以下の CSS を custom.css に追加することにします。
#phonebookvc,.phonebookvc { 
width:100%; 
}
ではこのスタイルをビューコントロールに適用したいと思います。表のセクションでは以前使用したものを再利用します。

ブラウザでの表示は下のようになります。

次回はチェックボックスと削除のアクションボタンをリンクさせる方法を見ていきます。

XPages Tutorial Part 46 : ロケーション文書の追加、修正、削除の機能を完成させる

Setting Up To Add Edit And Delete Locations {Original Source}

アプリケーションは XPages に関してはほぼ完成しました。
ユーザーはロケーションを選択し、そのロケーション内のスタッフ全員がわかり、ある人を選択すればその人の詳細の情報が確認できます。
また、PhonebookEditor というロールを持っているユーザーは、Person 文書を新規作成したり、編集したり、削除できるようになっています。残すところはロケーション文書の新規作成、編集、削除というところでしょうか。

アプリケーションに必要なものは、PhonebookEditor ロールを持つユーザーが特定のロケーションを選択できるようロケーションの一覧を作成する必要があります。そしてそのロケーションを選択したらロケーション文書にリンクした Xpage を開くことができ、編集と削除ができるようにしなければなりません。そして、新規文書を作成するための「Create」アクションも必要になります。

この機能を実現するために 2 つの新規 Xpage を作成します。
ひとつは「LocationAdmin」、もうひとつは「LocationEdit」にします。
作成には既存の XPage をコピーしてから名前の変更をするといいでしょう。
それから「content_LocationAdmin」と「content_LocationEdit」の 2 つのカスタムコントロールを作成します。
この 2 つのカスタムコントロールは「lotusContent」スタイルクラスが指定されているパネルが一つだけの単純なものから始めます。
<?xml version="1.0" encoding="UTF-8"?>
<xp:view xmlns:xp="http://www.ibm.com/xsp/core">
       <xp:panel id="lotusContent" styleClass="lotusContent">

       </xp:panel>
</xp:view>
新しい 2 つの XPage にもどって、現在設定されている「content_...」のところを先ほど作成したカスタムコントロールにそれぞれ対応するように置き換えてください。
このようにコードを再利用するとレイアウトやルックアンドフィールを損なうことなく素早く作成することができます。

次に電話帳を編集することができるユーザーには「Location Administration」のセクションにアクセスできるようにしたいと思います。
左側のサイドバーに新しいメニューを作るか今あるメニューの中に単にリンクを追加するかどちらでも構いませんが、今回は後者の方を採用したいと思います。
では「sb_LocationList」カスタムコントロールを開いてください。

現在の「sb_LocationList」のソースビューでメニューリストの部分のコードは下のようになっています。

では赤い線のところに管理者用のリンクを追加していきます。まず新しいパネルをドラッグインし、ソースビューに切り替えます。そしてパネルが正しい位置に配置されたかを確認します。そしてそのパネルに「lotusMenuSection」というスタイルクラスを設定してください。
最後にパネルの内部に Unordered Line を追加して、仮のテキスト (link Here) を書いておきましょう。

ではカスタムコントロールを保存して、XPage をプリビューしましょう。
この時点では下のように表示されるはずです。

上で表示されたセクションは「PhonebookEditor」のロールを持っていないユーザーには表示したくないので、先ほど作成したパネルを選択して、プロパティの「表示」の横にあるダイアモンドをクリックしそのユーザーがロールを持っているかどうかを値の計算で以下の JavaScript を記述します。
var s1 = context.getUser().getRoles();
var s2 = "[PhonebookEditor]";
if (@Contains(s1, s2) == @True())
{
       return true;
} else
{
       return false;
}
パネル上の表示のプロパティを使用すると、表示の式の値が false であった場合、パネルとその中のコンテンツ全体がブラウザには送られないようになっています。
Web ページ全体が必要とされるまで隠しておくことができるよい方法でもあります。

では、次「リンク」コアコントロールを固定文字を書いたところに上書きする形でドラッグインしてます。
リンクのラベルには「Edit Locations」と指定し、「オープンページ」プロパティで「LocationAdmin」XPage を指定します。

ではこのカスタムコントロールを保存しブラウザでプリビューしてみましょう。ログイン後、ロールによってリンクが表示されたり、されなかったりすることを確認してください。

このリンクをクリックしてもまだ「LocationAdmin」XPage はコンテンツがブランクです。これは次回に回すことにします。

2010/01/14

XPages Tutorial Part 45 : 既存文書の削除方法

Deleting A Document {Original Source}

電話帳アプリケーションには「Person」文書を作成する機能を作りましたが、削除の機能はどうなるのでしょうか、見ていきましょう。

では「content_Person」カスタムコントロールに新しいアクションボタンを作成し、コントロールペインから新しいリンクコントロールをドラッグインし、必要なスタイルクラスを指定することになるのですが、時間を節約するために、既に作成してあるアクションボタンを再利用することにしましょう。

どれかひとつを選択しクリップボードにコピーし貼り付けます。これで必要なスタイルクラスが定義された状態でボタンを作成できました。

このボタンを選択し、プロパティの中で新しい名前を「Delete Person」と定義します。


このボタンを使用できる人や、正しいタイミングで表示させるために「表示」のプロパティに以下の値の計算コードを入力します。

var s1 = context.getUser().getRoles();
var s2 = "[PhonebookEditor]"

if (personDoc.isEditable())
{
       return false;
} else if (@Contains(s1, s2) == @True())
{
       return true;
} else
{
       return false;
}

文書が編集モードであれば表示されません、編集モードでも ACL 設定で PhonebookEditor というロールがないユーザーには表示されません。

最後の仕上げとしてこのボタンにアクションを設定します。
イベントタブに切り替え onclick イベントを見てください。
一旦現在設定してあるものを削除して、「アクションの追加」ボタンで分類を文書、アクションを文書の削除を選択してください。

文書が削除された後に次に開く XPage の指定をし、確認テキストを入力することでアクションの確認をユーザーにさせることができます。

ではこのカスタムコントロールを保存して、ブラウザでプリビューしてください。
ログインし、かつ適切なロールを持っていればボタンが表示されるはずです。


ボタンをクリックすると確認のダイアログが表示されます。

OK ボタンを押すとさっき選択していたロケーションの「Person」のリストに戻ります。そしてその中にあった先ほど削除した「Person」文書は消えているはずです。

XPages Tutorial Part 44 : フィールドにドロップダウンコンボボックスを設定する

Adding A Dropdown Combobox Lookup To A Field {Original Source}

「Location」フィールドに対してノーツクライアントベースの開発では、おそらく @DbColumn 式を使って有効なロケーションをドロップダウンリストのとして表示させて選択させることが考えられます。
XPages でも同じようなことが「コンボボックス」コントロールを使用して実現できます。

「content_Person」カスタムコントロールを開き、右側のコアコントロールペインより「コンボボックス」コントロールを「Location」編集ボックスと置換えるようにドラッグインします。
まず最初に以前新規文書を作成する際に実装したようなフィールドを編集するときだけこのコントロールが表示されるように「読み取り専用」プロパティに JavaScript で値の計算を行います。

データタブに切り替え、データソースを「personDoc」、バインド先を「Location」フィールドに指定します。


ここでデフォルト値を設定することができます。今回、セッションスコープの「locationfilter」変数を使用することにします。この変数はは「Creat Person」アクションボタンをクリックしたときと同じロケーションの値が設定されています。きっとエンドユーザーが作成したい「Person」のロケーションが事前にそのようにデフォルト値が設定されていると便利だと思うからです。
では、ダイアモンドをクリックして、次の JavaScript を入力します。「sessionScope.locationfilter()」

コンボボックスのプロパティには「値」というプロパティセクションがあり、ここでドロップダウンボックスで表示させたい値を指定することができます。
「項目の追加」ボタンで値オプションを直接書き込むこともできます。また、「式項目の追加」ボタンで式を書くこともできます。両方を組み合わせるともできます。


式項目を使用する際にはラベルと値がパイプ(|)で分けられた文字を返す必要があります。また項目が複数ある場合には、ラベルと値のペアがカンマで区切られた形になります。
従来からの式言語の知識があれば簡単にできます。

「lkp_Locations」ビューでは 2 番目の列に下のようにロケーション名をパイプのシンボルで区切った列を作成してください。



では、「式項目の追加」ボタンをクリックし、次のコードを入力してください。
@DbColumn("","lkp_Locations",2);
最初のパラメータのブランクは現在のデータベースを使用する、2 番目のパラメータは参照するビューの名前、3 番目のパラメーターは実際の値を取得する列の番号です。

ではカスタムコントロールを保存して、プリビューしロケーションのデフォルト値が正しく表示されるか、ドロップダウンリストが正しく機能するかどうかを確認してください。

XPages Tutorial Part 43 : 新規文書ですべてのフィールドを利用できるようにする

Enabling All Fields On A New Document {Original Source}

XPage を使用して新しく「Person」文書を作成できるようになりましたが、姓名やロケーションが編集モードになっていても編集できないようになっています。当事者以外のエンドユーザーに直接変更されるのを防ぐためでしたが、新規文書の作成時に限ってはこれを無効にしたいと思います。

ノーツクライアント開発では @IsNewDoc という関数があり、文書が作成されていてまだ保存がされていないかを確かめるために使用してきました。XPages では @IsNewDoc() を JavaScript で同様のことができます。

「content_Person」カスタムコントロールを開き、設計ビューから「FirstName」編集ボックスを選択します。プロパティで、「読み取り専用」プロパティをがチェックされているのが確認できます。
これを今回値の計算にし下の JavaScript を記述してください。
if(@IsNewDoc() == 1)
{
       return false;
} else
{
       return true;
}
読み取り専用に設定されていたすべてのフィールドにこのコードを設定してください。
カスタムコントロールを保存し、プリビューした後、新規の「Person」文書を作成し、すべてのフィールドが編集可能か確認してください。


編集モードになると、フィールドに対するラベルが表示されないものがいくつかあります。そこでラベルを追加して、新規文書の作成のときだけ表示されるようにしましょう。

ではラベルコントロールをドラッグインします。ドラッグインしたラベルコントロールのラベルには表示プロパティがありますが、右のダイアモンドをクリックし、先ほど出てきたコードと全く反対のロジックを記述します。


「content_Person」の設計を次のような見た目にしてみましょう。

表を追加するとフィールドやラベルの配置が楽になります。
ではこのカスタムコントロールを保存してブラウザで再読み込みして確認してみましょう。
下のようなページになるはずです。

次回は Location に省略値を与え、適切なロケーションのリストからドロップダウンで選択するといった方法を見ていきます。