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

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

2018年1月1日月曜日

JavaScriptによるイベントの確認

新年、明けましておめでとうございます。


さて、ということで、どこかの誰かさんが「新年のブログまだですか?」とか言うので、書いてやろうじゃないか!と思ったので書いてやる次第です(笑)
新年になって早々・・・

内容は、昨日書いた
LotusScriptによるイベントの確認
に対して、JavaScriptによるフィールドイベントの確認についてです。

JavaScriptはNotesクライアントでも動きますが、LotusScriptで書いた方が楽ですから、
ここではWebクライアントおよびXPagesでの動作について書いていきます。

検証に使用するNotes DBも昨日と同じものを利用します。


1.クラシックWebの場合
クラシックWebでのフィールドイベントを設定する方法は、Notesクライアントとほぼ同じです。
フォームのフィールドを選択して、「OnChange」「OnBlur」イベントに記述するだけです。
WebでのonChangeイベント
「実行」の個所を"Web"、"JavaScript"にして、コードを記述すればOKです。
上の例は「fldText」というテキストフィールドの「onChange」イベントに記述しています。
コードの内容はWebブラウザのコンソールログにメッセージを表示するものです。
すでにNotesクライアント用のコードが記述してあるので、左側のところが上下の二色になっています。
同じように「onBlur」イベントにもコードを記述してみました。
設定自体は簡単ですね。

実行してみた結果がこちらです。
コンソールログへの表示なので、Webブラウザで「F12」キーを押してデバッグモードにしています。
クラシックWebでの実行結果

画面下部の赤枠部分を見てください。
Notesクライアントの場合、OnBlurイベントが発生してからOnChangeイベントが発生していましたが、
WebではonChangeイベントが先に発生しています。
NotesクライアントをWeb化しようとする場合、ここでは注意が必要という事ですね。

では、XPagesの場合はどうでしょう?

2.XPagesの場合
XPagesの場合、フォームに設定・・・はできませんので、XPage画面を作成してその中で設定します。
下図のような画面を作成して、イベントにコードを記述してみました。
XPagesのCSJSでイベントチェック

編集ボックスコントロールを配置して、そのonblurイベントにCSJS(クライアントサイドのJavaScript)を記述してみました。コードの内容は先ほどのクラシックWebのものと同じです。
同様にonchangeイベントにも記述してあります。
実行結果は下図です。
CSJSでのイベント確認の実行結果

クラシックWebの時と同じようにテキストフィールドに値を入力して、他のフィールドに移動してみたところ、
onchangeイベントが発生してからonblurイベントが発生しました。
Web系ではonchangeが先に発生するようですね。


XPagesの場合、CSJSだけでなく、SSJS(サーバーサイドJavaScript)での記述もできます。
こちらは少し面白い結果が出ました。

SSJSの場合、Dominoサーバーにイベントが送られるので、「サーバーオプション」を"更新なし"以外にする必要があります。
SSJSでのイベントチェック

実行結果は次の通りです。
SSJSでの実行結果

SSJSの場合、onchangeイベントはフィールドから移動しなくても発生します。
サーバーに随時値を送っているからだと思われます。
上の図で時間が少し開いているのは、値の変更後、すぐにフィールドを抜け出てしまうと、onblurイベントがなぜか発生しなくなるからです。
これもサーバーで処理をしている関係なのでしょうか?


さらに、SSJSとCSJSの両方にonblur、onchangeイベントを記述しておくと、onblurとonchangeが同時に発生しても、CSJSのonblurも実行されなくなります(フィールドの値を変更すると、onchangeしか発生しない。フィールドの値を変更しないでフィールドから外れるとonblurは発生する)。

細かい検証をしたわけではないので、正しく動いてくれているかどうかは不明ですが、実装する際は気を付けてみてください。






それでは今日はこの辺で。
今年も当ブログをよろしくお願いいたします。


Notes/Dominoで困ったことがあれば、弊社にお問い合わせください。
IBM Championの私が承ります!
お問い合わせはこちらから→Lotus Notes/Domino カスタマイズとセキュリティ強化 - 株式会社エフ

0 件のコメント: