やりたいこと / 理由
Confluenceの検索画面や検索フォームから検索をする場合。
指定したいキーワードを半角スペースで区切って入力すると、(なぜか)『AND』検索ではなく 『OR』検索 としてサーバサイドで処理されてしまいます。
残念ながら、この動作は、エンドユーザにとって直感的ではありません...。
『キーワードを複数入力したら、検索結果が絞り込まれる』ことを期待しているのに、逆に『検索結果が増える』という動作になってしまいます。
そこで、とにかくクイックサーチだけでも、もうちょっと直感的に操作できないかと、フロントを調整してみました。
調整項目
変更すること / クイックサーチEnter時の挙動
- クイックサーチのフォーム上に、複数キーワードをスペース区切りで入れてEnterしたら、サーバに送信する際に実際に送信するパラメータを調整する。(JavaScriptを利用)
- 半角スペースを" AND "に置き換え、文字列を連結させてる。
- サーバサイドには"AND検索" になるようなリクエストを送信するようにする。
変更しないこと
- クイックサーチの見た目に変更は加えない。
- Confluenceのサーバサイドの変更は行わない。(ソースコードの修正なども行わない)
- 検索時のパラメータの条件も調整を行わない。
検索機能は、画面上のUIだけではなく、APIなどでももちろん利用しているので、そこには手を出しません。
あくまでも、送信時に『AND検索』になるように、サーバに投げるパラメータをJavaScriptで調整してあげる、という動作になります。
調整方法
Confluenceでは、管理画面 → カスタムHTMLという場所で、追加のHTMLを加えたり、JavaScriptで要素を加えたりできます。
こちらを利用して、クイックサーチフォーム(#quick-search-query)の挙動を調整します。
だいぶ荒いコードですが、こんな感じ。
<script>
AJS.toInit(function(){
// TODO:デフォルトのフォームに、AND/OR切り替えのボタンかプルダウンあるといいかも
// デフォルト動作で検索したい場合があるので。
// quick searchでEnterされた時のみの動作
AJS.$( '#quick-search-query' ).keypress( function ( e ) {
if ( e.which == 13 ) {
var queryString = AJS.$('#quick-search-query').val();
// 全角スペースは無理矢理半角に変換
queryString = queryString.replace(/ /g," ");
if (queryString.indexOf(" ")!=-1) {
var array = queryString.split(' ');
// ダブルクォートで囲むと、その文字列を分かち書きしないで検索。
AJS.$('#quick-search-query').val(array.map(function(p){ return '"' + p + '"'; }).join(' AND '));
} else {
AJS.$('#quick-search-query').val('"' + queryString + '"');
}
return true;
}
});
});
</script>
結果
上記の結果、明示的に”AND検索" という条件を付けて、検索を実施となります。
サーバ側から返って来た結果画面の上部には、”キーワード1" AND "キーワード2" といったフォームが表示されます。
※ここから先は、とくに変更を加えません。とにかく『ANDで繋げれば、AND検索になるのね』ということが、その後利用する側に判ってもらえればいいかな...という感じです。