当ブログに掲載しているサンプルは、すべて利用者の自己責任という形でお願いします。
ただし、明らかな不具合がある場合、ご連絡いただければ、訂正記事を出します。
また、こちらのサンプルは、別のサイト等への公開、転載は一切禁止しています。
どうしてもと言う場合は、筆者にあらかじめご連絡ください。

Translate

2014年7月1日火曜日

XPagesを使って同じURLで別の内容を表示させてみる

こんにちは。気が付いたら、7月です。つまり、1年のうち、半分が過ぎてしまったという事になります。
1年の初めにたてた計画は順調に進んでいますでしょうか?
私?さぁ、どうなんでしょう。残り半年、悔いのないように過ごしましょう。

さて、今日も本題に入る前にボタンクリックよろしくです。
にほんブログ村 IT技術ブログへ


今日もXPagesネタです。
XPagesの画面は「XPage」と「カスタムコントロール」の2種類から成り立っていて、それぞれ「フォーム」と「サブフォーム」のような関係だよ。
という話は聞いたことがあるかと思います。
ですが、=(イコール)ではなく、≒(ほぼ等しい)なんですね。

そのため、「フォーム」と「サブフォーム」ではできていたのに、XPagesになったらできないよ!というものもあったりします。
例えば、「サブフォームの挿入」。通常は、指定したサブフォームをフォーム上に挿入するのですが、「式の定義によりサブフォームを挿入」を選択して[OK]をクリックすると(下図参照)、どのサブフォームを挿入するのかを決める式が記述できるようになります。
サブフォームの挿入
式はこんな感じに書きますね(あくまで一例)。ここで気を付けなければいけないのは、サブフォームの挿入は動的に行うことはできません。フォームを開いた時に決まります。
サブフォームの挿入式


こんな感じのことをXPagesでやってみよう!となるのですが・・・
さぁ、どうすれば良いでしょう?


XPageの中にカスタムコントロールを配置する?普通なら、そう考えますよね。
ところが、実は、これができないんですね。
カスタムコントロールは指定したものしか挿入できないのです。
計算式によって、挿入するものを変更できないんですね。

では、どうするのかというと・・・
「ページの組み込み」コントロールを使います。
コンテナコントロールの中に「ページの組み込み」があるので、それをXPage(もしくはカスタムコントロール)の中に ドラッグ&ドロップします。
ページの組み込みコントロールを使う

すると、どのページを挿入するのかを選択するダイアログが表示されるので、「ページの自動生成」を選択します(下図参照)。
ページの選択

ここで、ページ名を入力しても良いですが、それでは意味がないので、◇をクリックして、「値の計算」を選択します。
ここに式を記述することにより、任意のページを挿入することができます。

サンプルでは、「selectPage1」という名前のコンボボックスを作成しておき、データは「sessionScope.selectedPage」にバインドするようにしておきます。
また、その隣にボタンコントロールを配置しておきます。このボタンの「onClick」イベントに自ページを開くというアクションを設定しておきます。
自ページを開く

そして、「ページの組み込み」の自動生成式は以下のような式を記述します。(画面でごめんなさいね。書くのめんどくさいんだよ)
ページの自動生成式

当然、「sub0」「sub1」「sub2」というXPageは作成しておく必要があります(実行する前であれば、いつ作成しても良いです)。

そして出来上がったサンプルを実行したのがこちら。
video


今回は動画にしてみました。コンボボックスの値を変更して、ボタンをクリックすると、下のページが切り替わるのがわかっていただけたでしょうか?

こちらもサブフォームと同様に動的に画面を生成することはできないようで、画面更新ではページが切り替わりませんでした。そのため、自ページを表示しなおすという事をしています。


ともあれ、XPagesでもサブフォームを挿入するような方法があるということがわかっていただければ、幸いです。



では、今日はこの辺で。


Web化するならXPages!






【PR】ノーツ/ドミノに関するお問い合わせは下記まで【PR】
単純なDBのカスタマイズから他アプリケーションとの連携までご要望にお応えします!
Lotus Notes/Domino カスタマイズとセキュリティ強化 - 株式会社エフ



2014年6月16日月曜日

XPagesでコントロールに複数のスタイルシートを設定するには?

こんにちは。週末は晴れたので、外出された方も多いのではないでしょうか。
私も夏へ向けて、散髪してきました。すっきりして気持ちいいです。

さて、今月はなんか記事を書かないといけないような気がしてならないので、今日もひねり出します。
と言っても、大したことは書いてないですし、書けませんが・・・

さぁ、まずはこちらのボタンをクリックして先へと進みましょう。
にほんブログ村 IT技術ブログへ


今日もXPagesについてです。

XPagesでは各コントロールに修飾をすることができます。
ラベルコントロールに対して、フォントサイズを大きくしたり、色を変えたり。
表コントロールに対して、幅や高さを変えたり。

それには、いくつか設定方法があります。
直接、コントロールのプロパティに設定する方法やスタイルシートを定義して、それを当てはめる方法等です。

直接、コントロールのプロパティを設定する場合、各コントロールで自由に設定できる反面、同じ設定を何か所もしないといけないことがあります。
コントロールのプロパティ

コントロールの数が増えてくると、これはとても面倒ですよね。

そんな時は、スタイルシートを活用しましょう。
スタイルシートを作成しておけば、コントロール用に作成したスタイルをプロパティビューの「スタイル」タブで設定するだけで済みます(下図参照)。
スタイルのセット

では、別々のコントロールにスタイルを設定する場合を考えてみましょう。
それぞれのコントロール用にスタイルを設定してしまうと、同じスタイルが乱雑してしまうことが考えられます(たとえば、width:100%やfont-size:10ptなど)。
これでは、直接コントロールにスタイルを設定しているのと何ら変わりはありません。


そこで、スタイルシートで良く使うものは、独立して定義をしておきます。
そして、その独立したスタイルとそのコントロール用のスタイルをまとめて設定すると良いです。

これのやり方は、下図のようにスタイルのクラスを" "(空白)で区切って入力します。
一覧から選択する場合は、Ctrlキーを押しながら、マウスでクリックします。
複数のスタイルを設定する

簡単にできますね。
これで、同じスタイル定義をいくつも書かずに済みますね。



スタイルシートの設定もこのようにまとめていけば、可読性が少しは高くなるのではないでしょうか?
色々と試して、自分なりのまとめ方を模索してみてください。

では、今日はこの辺で・・・



Web化するならXPages!





【PR】ノーツ/ドミノに関するお問い合わせは下記まで【PR】
単純なDBのカスタマイズから他アプリケーションとの連携までご要望にお応えします!
Lotus Notes/Domino カスタマイズとセキュリティ強化 - 株式会社エフ




2014年6月9日月曜日

XPagesでグラフを描いてみよう

おはようございます。気が付いたら、関東地方も梅雨入りしたようです。
でも、気分までじめじめしないようにしたいですね。



では、今日の話題へと。
今までいくつかXPagesについて書いてきましたが、グラフ描画について触れていないことに気が付きました。
理由はいくつかあるのですが・・・

理由はさておき、今日はXPagesでグラフ描画をする方法についてのご紹介です。
グラフ描画の方法はいくらでもあるのですが、XPagesでということなので、
標準搭載されているDojoでの実現方法についてです。


内容に入る前に、今日も、こちらのボタンをクリックしてから読みましょう。
にほんブログ村 IT技術ブログへ


実は、XPagesそのものにはグラフ描画をするコントロールは用意されていません。
ですので、dojo toolkitを使って描画するということになります。
私の環境はIBM Notes/Domino 9.0.1ですので、dojoのバージョンは1.5.21.8(2014/06/20訂正)になります。
最新バージョンは1.9になっていますので、動きの違いや設定方法の違いがあるかもしれませんが、そこはご了承ください。


XPagesでDojo Toolkitを使ってグラフを描画するには、次の作業が必要です。

  1. グラフを描画するためのDojoモジュールを組み込む
  2. グラフを描画するための領域を作成する
  3. グラフを描画するためのデータを用意する 
  4. グラフを描画するためのJavaScriptを記述する

一つ一つ説明していきましょう。
まずは、1.のグラフ描画用Dojoモジュールの組み込みです。
こちらはXPage(もしくはカスタムコントロール)のリソースとして設定します。
下図は「カスタムコントロール」に円グラフの描画に必要なDojoモジュールを組み込んだところです。
円グラフ描画用のDojoモジュール
手順は次の通りです。
XPage(もしくはカスタムコントロール)を開いて、「プロパティ」ビューの「リソース」タブを開きます。
[追加][Dojoモジュール]ボタンをクリックします。
リソースの追加

すると、「Dojoモジュールをページへ追加」というダイアログが表示されるので、Dojoモジュール名を入力して[OK]をクリックします。
Dojoモジュールをページへ追加

この時、何を記述すればよいか、わからないですよね。
Dojoモジュールは、下記のディレクトリ配下にありますので(Notesクライアントの場合も同じ場所にあります)、ここをrootとして、モジュール名を記述します。ディレクトリは「.」(ピリオド)で表します。
Dominoデータディレクトリ\domino\js\dojo-1.5.2\
例えば、グラフそのものは「Dominoデータディレクトリ\domino\js\dojo-1.5.2\dojox\charting\Chart2D.js」というライブラリになるので、
dojox.charting.Chart2D
と記述します。
※どんなモジュールがあるのかについては、後述するDojo Toolkitのサイトを参照してください。
ここでは、上記の他、「dojox.charting.themes.Chris」というモジュールを追加してください。
(これは描画時の画面スタイルでテーマと呼びますが、たくさんの種類があります。種類はDojo ToolkitのDemosページの「Chart Plot Types」で確認してください)


では次に2.のグラフ描画領域を設定しましょう。
これは、単純に
があれば良いのですが、ここはXPagesでの設定方法を。
簡単なのは、パネルコントロールを配置することです。
その際、高さと幅を設定するのを忘れないようにしましょう。デフォルトだとAuto設定になるので、変な風に表示されてしまいます。
数値はお使いのPCの環境に合わせてください。また、コントロール名も設定することを忘れないでください。
私のPCでは、高さ360ピクセル、幅640ピクセル、コントロール名を「myChart」としました。
グラフ描画領域の設定(パネルコントロール)

3.のグラフ描画用のデータは当然必要になってきますね。
このデータは4.のJavaScriptを記述するときに必要になります。
注意しなくてはならないのは、このデータは配列(Array)形式で作成しなくてはならないという事です。
さらに、グラフの形式によって設定方法が若干異なるので、どんなグラフを作成するのかをあらかじめ決めておくと良いでしょう。
ここでは、円グラフを作成するので、ビューの文書数をカウントするような形にしたので、こんな感じです。
var dStore1 = '{y:' + cnt1 + ',' + 'text:"障害(解決済)"}';
これをArrayに格納するので、
chartArray.push( dStore1 );
としています。
このArrayをグラフのデータとして利用します。



最後に4.のグラフ出力用のJavaScriptの記述です。
えー・・・正直言うと、わかりませんでしたので、OpenNTFにあるCRM Applications for XPages in Japaneseを参考にさせていただきました。
うーん、OpenNTFは役に立ちますね。

実際には次の手法となります。
「出力スクリプト」コントロールを配置して、「すべてのプロパティ」のvalue項目に式を記述します。
なお、この「出力スクリプト」コントロールはデフォルトの状態ではコントロールビューには表示されないので、「その他」から選択する必要があります。
出力スクリプトコントロールを追加

また、式は「外部プロパティエディタ」を起動するというアイコンをクリックして記述します。
出力スクリプトのValue
こうすると、クライアントサイドJavaScriptが記述できます。「値の計算」を選択すると、サーバーサイドJavaScriptになってしまい、グラフ描画が行えませんので、注意してください。
出力スクリプトはこんな感じになります。
グラフ描画用スクリプト
コメントが付いているので、なんとなく理解していただけるのではないかと思いますが、念のため。

XSP.addOnLoad
というのは、グラフ用のページがロードされたときのイベントです。画面を開いた時にグラフを描画しますよ。ということですね。

var myChart = new dojox.charting.Chart2D( "#{id:myChart}" );
というのはグラフオブジェクトを定義しているところです。
1.で設定したDojoモジュールがここで使用されています。また、パネルコントロールの名前をmyChartにしたので、そこにグラフオブジェクトを関連付けしています。
"#{id:~}"というのは、XPagesのコントロール名をクライアントサイドのJavaScriptで指定する際の決め事と思ってください。

myChart.addPlot( "default", { type: "Pie" } );
というのでグラフの種類を設定しています。Pieが円グラフを表しています。
※画像ではmyChart.addPlot( "default", { type: Pie } );となっていますが、
Pieは"Pie"とするのが正しいです。

myChart.addSeries( "default", #{javascript:getChartData();}, {stroke: {color: "blue", width: 3}} );
でグラフのデータを設定しています。
{stroke: {color: "blue", width: 3}}はオプションですので、なくても構いません。
getChartData()は3.で説明したグラフ描画用のデータ取得関数です。Arrayが返ってくるようにしてあります。

myChart.setTheme( dojox.charting.themes.Chris );
でグラフの描画スタイル(テーマ)を決めて、

最後に
myChart.render();
でグラフを描画しています。

色々とオプションを設定していますが、こんな風に表示されます。
円グラフのサンプル

とりあえず、グラフの描画ができました。
グラフ描画には様々なオプションがあるのですが、多すぎて紹介しきれません(汗)。

Dojo Toolkitのサイトを見ると、サンプルコードが載っていたり、デモ画面も見られるのでぜひ参考にしてください。
Dojo Toolkitはこちらのサイトに情報があります。私も参考にしながら、この記事を書きました。
Unbeatable JavaScript Tools - The Dojo Toolkit
「Documentation」というタブの「Reference Guide」というリンクと「API Documentation」というリンクの内容が役に立ちます。






では、今日はこの辺で。


Web化するならXPages!






【PR】ノーツ/ドミノに関するお問い合わせは下記まで【PR】
単純なDBのカスタマイズから他アプリケーションとの連携までご要望にお応えします!
Lotus Notes/Domino カスタマイズとセキュリティ強化 - 株式会社エフ




2014年6月3日火曜日

XPagesでEnterキーを押したときに実行するようにしたい

今回で450本目の記事です。
ブログを始めて、6年と2か月なので、1か月あたり6本の執筆?です。
最近の頻度からすると、多めですね。始めた当初は、ほぼ毎日更新していたので、そのためにこんな数字になっているのでしょう。

閑話休題。今日も始まる前にボタンをクリックしましょう。
にほんブログ村 IT技術ブログへ


では、今日の話題です。
Webサイトで、入力ボックスだけあって、そこに値を入力して、Enterキーを押すと、内容に従って処理が実行されるものがあります。
検索なんかがそうですね。

あれをXPagesでも実装できたら格好いいですよね。
ということで、それをやってみましょう。


用意するコントロールは、編集ボックスとボタンです。

まずはボタンの説明をしましょう。
ボタンの名前は後で必要になるので、覚えておきます。
ここでは、btnSearch としておきます。
ボタンには、普通に処理させたい内容を記述します(onClick イベントに記述)。
そのボタンのスタイルを
display:none
とします。
これはUIでは設定することができないので、プロパティビューの「すべてのプロパティ」を開いて、
そこの「style」という項目に直接記述します。
非表示にするというスタイル指定ですが、「可視」のチェックを外すのとは意味が違い、「可視」のチェックを外してしまうと、動かなくなってしまうので、要注意です。
ボタンのスタイルを設定

次に編集ボックスの説明です。
こちらのクライアントサイドJavaScriptを記述することで実行できるようになります。
 イベントビューを開いて、イベント種類は「onkeypress」を選択して、クライアントサイドを選択します。
以下の内容を記述します。
----------------------------------
if ( thisEvent.keyCode == 13 ) {
    var element = document.getElementById( "#{id:btnSearch}" );
    element.click();
}
----------------------------------
ここで、重要なのは#{id:btnSearch}です。
このbtnSearchは最初に作成したボタンの名前です。

ちなみに、
thisEvent.keyCode == 13
というのがブラウザでのEnterキー を表します。

つまり、Enterキーが押されたら、btnSearch ボタンをクリックしてください。
という命令になります。
これで、btnSearch ボタンのonClickイベントが発動します。


出来上がりは下図のような形になります。

編集ボックスのイベント

実装はこれで終了です。

※onkeypressは、ブラウザごとに挙動が違うということらしく、このままでは動かない可能性もあります。
イベント挙動を考慮することについては、私の知り合いのめそ凹すね丸さん【JavaScript】クロスブラウザでEnterを検知するにはにて、解説を書いていただいていますので、そちらを読んでいただけると、より理解が深まると思います。(2014年6月5日追記)


いかがでしょうか?思ったよりも簡単でしょう?

これに、XPagesでplaceholderを実現してみる で説明したplaceholderを設定してみると、検索ボックスみたいで雰囲気が出るでしょう。


いざ動かしてみると、ちょっとした感動を味わえますよ(あくまで個人の感想です)。
簡単なので、試してみてください。


では、今日はこの辺で・・・



Web化するならXPages!










【PR】ノーツ/ドミノに関するお問い合わせは下記まで【PR】
単純なDBのカスタマイズから他アプリケーションとの連携までご要望にお応えします!
Lotus Notes/Domino カスタマイズとセキュリティ強化 - 株式会社エフ




2014年6月2日月曜日

XPagesで検索を行った結果をハイライト表示する

みなさん、こんにちは。

今日も頑張って更新しましょう。

相変わらず暑いので体調管理だけは気を付けて行うようにしましょう。
では、このボタンをクリックして先に進みましょう。
にほんブログ村 IT技術ブログへ




さて、今日はXPagesでの検索です。
某Q&Aサイトで質問が出ていたのですが、回答が付かないようなので気になって調べてみました。

DominoのWebアプリケーション(従来のWeb対応のノーツDB)は、全文索引を付けておけば、検索結果を強調表示してくれます。
ではXPagesでは、どうなんでしょうか?

XPagesでの全文検索の実装方法は、8. XPagesで全文検索機能を利用するには?に詳しく出ていますのでそちらを参照願います。

しかし、こちらのページを見ても、結果は強調表示されていませんね。
どうやら、XPagesでは検索結果の強調表示は標準では実装されていないようです。

となると、自分で作りこむしかないようです。

Webブラウザ上で強調表示を行うということなので、HTMLのタグを使うとよさそうです。
ということで調べてみると、<mark></mark>というタグがあるようです。
説明にも「検索結果の画面で文字をハイライトさせるのに利用します」といったことが書かれていますので、確かにこれで間違いなさそうです。

使い方は、<mark></mark>の「~」の部分がハイライト表示させたい文字列です。
今回の場合、検索文字列になります。
検索文字列をスコープ変数(ページを移動する場合は、sessionScope変数にしておく必要があります)に格納しておきます。

後は、検索結果を表示するページ内のデータの値を
検索文字列 → <mark>検索文字列</mark>
といった形で置換すれば良いのです。

この時、気を付ける点がいくつかあります。
  1. コントロールの「escape」プロパティはfalseにする
  2. escapeプロパティを持たないコントロール(複数行編集ボックス等)の場合、表示用の計算結果コントロールを作成して、そこでハイライト表示させるようにする
  3. ビューコントロールのビュー列の場合、コンテンツタイプをHTMLにする
  4. 検索結果ページから別のページに移動するときには、検索文字列のスコープ変数をクリアする
また、3.のビュー列の場合、データを「ビューの列」にしていると文字列の置換を行うことができないので、「計算結果の値」にして、
viewEntry.getColumnValue( "列名" );
という形で列の値を取得する必要があります。


ということで実装してみた結果が下図です。
検索結果をハイライトしてみた

文字列の置換方法は、Domino Designerのヘルプを見て探してみてください。
XPagesで使える@関数の中にありますよ。



今回の調査では、HTMLのmarkタグに行きつくかどうかがカギでした。
そこから先は、色々な方のHPを参照させていただき、文字列の置換という方法が現実的だということがわかりました。


このようにXPagesはHTML、CSS、JavaScriptの技術をふんだんに使っていますので、そういった技術情報の応用が可能なんですね。
XPagesを始められる方は、こういったページも調査対象にすると良いでしょう。


では、今日はこの辺で・・・


Web化するならXPages!



【PR】ノーツ/ドミノに関するお問い合わせは下記まで【PR】
単純なDBのカスタマイズから他アプリケーションとの連携までご要望にお応えします!
Lotus Notes/Domino カスタマイズとセキュリティ強化 - 株式会社エフ




2014年6月1日日曜日

XPagesで文書保存時に添付ファイルの数を限定させるには


皆さん、こんばんは。ついに6月です。いやぁ、5月は1日に記事を書いて、「まぁ、余裕だろ。今月は記事は5個くらいは出せるかな?」とか思ってました。
ホント、すみません。先に謝っておきます(謎)。

さて、昨日、私の住んでいる地域の気温が30度を超えました。今日も、30度を超えていたので、まさに「お外あつかーまん」でした。
おかげで、ゆっくりと記事の構想を練ることができませんでした。無理です。こんな暑い中、詳しい調べもんなんかできません。


ということで、簡単な記事を書いて逃げておきます。では、こちらをクリック!
にほんブログ村 IT技術ブログへ



今日は、XPagesでの添付ファイルの取り扱いについてです。
添付ファイルのアップロード方法自体については、以前(XPagesで添付ファイルの処理をする(アップロード) )に取り上げていますので、そちらを参照してください。

今日は、文書に添付するファイルの数を限定する方法についてです。
基本的には従来のノーツアプリケーションでの方法がそのまま使えます。それをXPagesのSSJSで実装するだけです。

1.文書を保存するフォームに「リッチテキスト」フィールドを作成しておきます。

2.1.で作成したフォームに計算結果のフィールドを作成します。
その値には「@AttachmentNames」という式を記述しておきます。

3.次に文書を編集するXPageを作成します。添付ファイルのアップロードコントロールを追加しておきましょう。2.で作成した計算結果のフィールドはコントロールとして配置する必要はありません。

4.文書を保存するアクションに次のように記述します。
これはサンプルで、添付ファイルは1つだけOKとしています。

保存アクションの内容
こんな感じです。
---------------------------------------------------------------
var doc = document1.getDocument( true );

if ( doc.computeWithForm( true, true ) ) {
    var afile:java.util.Vector = doc.getItemValue( "計算結果のフィールド名" );
    if ( afile.size() > 1 ) {
        view.postScript( "alert('添付ファイルは1つしか添付できません。')" );
        return false;
    } else {
        doc.save( true );
        context.redirectToHome();
    }
}
---------------------------------------------------------------

computedWithFormで、フォームに合わせて計算を行います。
これで、アップロードコントロールでアップロードした添付ファイルのファイル名が「計算結果のフィールド」に格納されます。
次に、getItemValueで計算結果のフィールドの値を取得してきます。
この時、戻り値はjava.util.Vectorという配列となっています。

そこで、sizeメソッドを使って、配列の要素数を取得します。
要素数が自分で設定した値(ここでは1)より大きい場合にはエラーとして
falseを返して終了させます。

view.postScript( "alert('添付ファイルは1つしか添付できません。')" );
は、画面上にダイアログを表示するものです。

配列の数が設定した値を下回っていれば、doc.save(true)で文書を保存して、終了します。
同じ画面にいると、二重保存の危険があるので、
context.redirectToHome();
でトップページに移動しています。


LotusScriptが書ければ、上の式は分かっていただけると思います。
これでXPagesでも不用意にファイルを添付させないようにすることができるのではないでしょうか。
工夫次第では、ファイルの拡張子を特定して、決められたもの以外は添付させないようにすることも可能でしょう。



色々試してみてください。では、今日はこの辺で。


Web化するならXPagesで!




【PR】ノーツ/ドミノに関するお問い合わせは下記まで【PR】
単純なDBのカスタマイズから他アプリケーションとの連携までご要望にお応えします!
Lotus Notes/Domino カスタマイズとセキュリティ強化 - 株式会社エフ




2014年5月1日木曜日

リンクをクリックしたときにURLパラメータを追加する方法

こんにちは。今日は2014年5月1日です。つまり、2014年も3分の1が過ぎてしまった!!!ということになります。
んー・・・やりたいことはたくさんあるのに、遅々として進まない。でも時間だけが過ぎ去っていく。
ジレンマです。

ブログも4月は1件しか書いてないし・・・
XPagesアプリケーションを作成していたのですが、ブログにアップできるようなネタがなかったのが原因という言い訳です。

と言っても、それでは進まないので、ボタンをクリックしてから話をしましょう。
にほんブログ村 IT技術ブログへ


では、気を取り直して・・・

ページ間の遷移を行うのには、「リンクコントロール」を使います。
通常、指定したURLやXPageを開くだけだと思いますが、実はこの時、URLパラメータを追加することができます。

まずはリンクコントロールをドラッグアンドドロップして画面に配置します。
次に、このリンクをクリックしたときのページを選択します。
ここは、「home」というXPageを開くように設定します(下図参照)。
リンクタイプの選択

次に、「すべてのプロパティ」タブを開いて、[データ][parameters]を選択します。
[+][-]というアイコンがあるので、[+]をクリックして、各プロパティを設定します。
項目名説明
nameURLパラメータのパラメータ名
valueURLパラメータに設定する値。URLエンコードしておく必要がある

リンクコントロールのプロパティ

今回はURLパラメータ名は「usrName」、値はログインしているユーザ名の共通名部分とします。
値はJavaScript式で記述します(下図参照)。
URLパラメータに設定する値


これで設定完了です。
XPageを保存して、画面を開いた結果がこちらです。
わかりやすくするために、リンクを3つ配置してあります。

1つ目はデフォルトの状態(リンクタイプがURLになっています)。
リンクコントロールにマウスポインタを重ねると、画面下部にリンク先のURLが表示されますが、
この場合、現在のページのURLに「#」が付いただけの状態になっています。
リンクタイプがURLのまま


2つ目はリンクタイプを「ページを開く」に設定した状態です。
こちらは、リンク先のページとして設定した「home.xsp」を開くような形になっています。
リンクタイプを「ページを開く」にした状態

そして、3つ目。
URLパラメータを設定したものです。
home.xspの後に設定したURLパラメータがついているのがわかります。
URLパラメータを設定したリンクコントロール


こうして設定したURLパラメータはリンク先のページでは、
context.getUrlParameter( "パラメータ名" )
で取得することができます。

ページ間にまたがって、変数の値を保持しておきたいという時に利用できるでしょう。
リンクコントロールはよく使うものでしょうから、組み合わせてみてください。


では、今日はこの辺で・・・




ノーツでWeb化するならXPages!
ノーツアプリケーションの改修はXPagesで!







【PR】ノーツ/ドミノに関するお問い合わせは下記まで【PR】
単純なDBのカスタマイズから他アプリケーションとの連携までご要望にお応えします!
Lotus Notes/Domino カスタマイズとセキュリティ強化 - 株式会社エフ