こんばんは
久々の投稿です
最近、事務集約などでNotesの改修が増えてきて、
色々な知恵を絞りだしている方のサッカー馬鹿です
さて、今回は最近開発した「SearchTemplate」を使った改修のネタになります。
実際のところ、XPagesすべて作り替えればいいのですが
既存の一部分の改修でそんなに日数もかけられないのが事実なんデスケドネ。。。
（問題なく動いているDBの改修はしたくない）
依頼された内容は、
「Webで検索された画像を並べて表示してほしいとの事」
※社内の情報は見せられないので簡単作成して再現しています
＜現在＞
SearchViewで文字検索をして、SearchTemplateをカスタマイズして表示させています。
（イメージ図）
こちらのSearchTemplateは以前ブログに書いた
「閑話休題：明日から22日までセミナーいっぱい！」を実装しています。
こんな感じで列にタグを書き込み・・・
ビューのプロパティで「ビューの内容をHTMLとして扱う」にチェックをし保存。
$$SearchTemplate for <ビュー名>を作成し、
タグを書いてパススルーHTMLと$$ViewBodyフィールドを配置。
以上が出来たら、検索URLを叩いてあげれば表示先ほどのように
表の中に画像が入ったWebページが出来ます。
検索URLの例）http://www.lotus-10.com/products.nsf/ProductView?SearchView&Query=<検索文字>
詳しくは文字を検索する URL コマンドを参考にしてください。
さて、ここからが本番・・・
並んで表示しているけどこれじゃないのか？と聞いたところ・・・
こんな風に並べて表示させたいらしいです
・・・そっちの並びね
実現方法は2つあると思っています。
１）?OpenFormを使ってパラメータに検索キーをつけて、
フィールドもしくは計算結果テキストに式を書いて表示させる。
こちらの方法は、@URLQueryString、@DbLookupを使って列の値（タグ）を取得。
@Forでループさせて、ループ内で指定列数で割り切れる数値の時に"</tr><tr>"を追加して・・・とやっていくと実現できます。
列が５つの表を作りたい時は@Forのｎが５で割り切れる時に折り返しのタグを追加する
みたいな感じですね
問題点は、画像のファイル名がガッツリ日本語なので@DbLookupで持ってこれない事が多々ありました。
その時は計算結果テキストで逃げたりもしました。
（埋め込みビューは試していません）
２）SearchTemplateを駆使して表示させる。
こちらの方法は、URLのパラメータで持ってくる文書数を操れるので
例えば「ヒット率の高い上位20件のみ」などと表記をすれば文字数制限の壁は越えられると思っています（多分）。
問題点は・・・Tableタグの列対応が出来ない
確か@DocNumberは文書の＃という事で番号を振ってくれますが、Webでは使用できなかったと記憶しています。
さて、どうしたものだろう
数分ググったところ、見つけたのがこちらのサイト
https://gist.github.com/pistatium/5963229#file-tablebuilder-js
なるほど
JSONからJavaScriptでTableタグを上手に書いていけばいいのか
$$ViewBodyの値が以下のようになればいいんですよね
/* テーブルにしたいデータ */
var data = [
{'id':1, 'created_at':'2013/05/01', 'updated_at':'2013/07/01','title':'記事1'},
{'id':2, 'created_at':'2013/06/01', 'updated_at':'2013/07/02','title':'記事2'},
{'id':3, 'created_at':'2013/07/01','title':'記事3'},
];
＜やってみた＞
先ほどのタグを書いたViewを開き、例にならって列を書き込み保存します。
Notesで見てみると・・・いい感じです
SearchTemplateも書き換えてみます。
１）先ほどのJavaScriptをSearchTemplateにコピペし、コードの前後に<script>タグを追加します。
２）先頭に「<div id="output"></div>」を追加します。
３）テーブルのヘッダーのラベルを変更します。
４）return html; の箇所の変更を忘れずに・・・
５）var data=[$$ViewBodyフィールド];とし、全コードを選択して「文字＞パススルーHTML」として保存します。
検索URLを叩いてみると・・・
スゲー
これならSearchTemplateの中でJavaScriptを書きまくれば、素敵な表も出来上がりますね
という事で、画像を並べてみたのがこちら（デザインはやってませんが）
並んだ×２Notesの画像が
どうせなので画像ダウンロードリンクも追加してみました。
参考にしたサイト：https://qiita.com/gnk0096/items/0e2dfe5d76a7968e1e23
XPagesが便利でついつい何でも頼ってしまいがちですが、
以前からあるSearchTemplateやViewTemplate、パススルーHTMLでも自由度が高いと改めて感じた今日この頃でした
今日はこの辺で・・・
あでゅー