概要
テキストボックスのプロンプトに、以下のように、ブランク区切りで複数の検索ワードをフリー入力し、絞込みを行う機能をJavaScriptを用いて実装する例です。
実装方法
Report Authoringの定義は以下のイメージです。
パッケージは「GO データ ウェアハウス (クエリー)」を使用しています。
① テキストボックスのプロンプト
国名をブランク区切りでフリー入力するためのプロンプト
② 複数選択の値のプロンプトを非表示としている
①で入力されたワードを、③のHTML Itemで読み取り、②の値のプロンプトを自動選択させる実装となる。
③ テキストボックスのプロンプトの入力ワードを読み取り、値にプロンプトの選択に反映させるJavascript。
<script language="javascript">
var fW = (typeof getFormWarpRequest == "function" ?
getFormWarpRequest() : document.forms["formWarpRequest"]);
if ( !fW || fW == undefined) { fW = ( formWarpRequest_THIS_ ?
formWarpRequest_THIS_ : formWarpRequest_NS_ );}
var var1=fW._textEditBoxid2;
var var2=fW._oLstChoicesid3;
function SplitText()
{
if ((var1.value=='')|| (var1.value==null))
{
alert("No values were entered! Please enter some values.");
}
else
{
var text_array=var1.value.split(" ");
var numberofsplits=0;
while (numberofsplits < text_array.length)
" {"
" for (var i=0;i < var2.length; i++)"
" {"
" if(var2[i].value==text_array[numberofsplits])"
" {"
" var2[i].selected=true;"
" }"
" }"
" numberofsplits++; "
" }"
promptButtonFinish();
}
}
</script>
④ レポート実行のためのFINISHボタンの実装
<input type="BUTTON" class="clsPromptButton" style="font-size: 90%; background-color:#dcdcdc; height: 24px" onClick="SplitText()" value=" Finish ">
⑤ 入力したワードとフィルター内容をクリアーするClearボタンの実装。
<button id="clearPromptsBtn" class="icdUI clsPromptButton" style="font-size: 90%; background-color:#dcdcdc; height: 24px">Clear</button>
<script>
" var xfdf = { }"
" xfdf.hookEventHandler = function() {"
" var cleanerBtn = document.getElementById(""clearPromptsBtn"");"
" cleanerBtn.onclick = xfdf.clearValues;"
" }"
" xfdf.clearValues = function(eventObject) {"
" var oCR= cognos.Report.getReport(""_THIS_"");"
" var aPromptControls = oCR.prompt.getControls( );"
" for(var i=0; i<aPromptControls.length; i++) {"
" var p =aPromptControls[i];"
" p.clearValues();"
" }"
" xfdf.cancelBubble(eventObject);"
" return false;"
" }"
" xfdf.cancelBubble = function(eventObject) {"
" if (!eventObject) var eventObject = window.event;"
" if (eventObject.cancelBubble) eventObject.cancelBubble = true;"
" if (eventObject.stopPropagation) eventObject.stopPropagation();"
" xfdf.reprompt();"
" }"
" xfdf.reprompt = function(){"
" promptAction('Reprompt');"
" }"
" xfdf.hookEventHandler();"
</script>
レポートXML定義
以下のXML定義をコピーし、Report Authoringの「ツール」->「クリップボードからレポートを開く」でレポートを作成。
<report xmlns="http://developer.cognos.com/schemas/report/12.0/" expressionLocale="en" useStyleVersion="10"><!--RSU-SPC-0093 レポート仕様は、2015 年 5 月 9 日に "http://developer.cognos.com/schemas/report/11.0/" から "http://developer.cognos.com/schemas/report/12.0/" へアップグレードされました。 5:54:34-->
<modelPath>/content/folder[@name='サンプル']/folder[@name='モデル']/package[@name='GO データ ウェアハウス (クエリー)']/model[@name='model']</modelPath>
<drillBehavior modelBasedDrillThru="true"/>
<layouts>
<layout>
<reportPages>
<page name="Page1">
<style>
<defaultStyles>
<defaultStyle refStyle="pg"/>
</defaultStyles>
</style>
<pageBody>
<style>
<defaultStyles>
<defaultStyle refStyle="pb"/>
</defaultStyles>
</style>
<contents><table><style><defaultStyles><defaultStyle refStyle="tb"/></defaultStyles><CSS value="border-collapse:collapse;width:100%"/></style><tableRows><tableRow><tableCells><tableCell><contents/></tableCell></tableCells></tableRow><tableRow><tableCells><tableCell><contents><table><style><defaultStyles><defaultStyle refStyle="tb"/></defaultStyles><CSS value="border-collapse:collapse;width:100%"/></style><tableRows><tableRow><tableCells><tableCell><contents><textItem><dataSource><staticValue> 国名選択:</staticValue></dataSource><style><CSS value="font-weight:normal;font-style:normal"/></style></textItem><textBox name="id2" parameter="pCon1" required="false"/><textItem><dataSource><staticValue> </staticValue></dataSource></textItem><HTMLItem>
<dataSource>
<staticValue><input type="BUTTON" class="clsPromptButton" style="font-size: 90%; background-color:#dcdcdc; height: 24px" onClick="SplitText()" value=" Finish "></staticValue>
</dataSource>
</HTMLItem><HTMLItem>
<dataSource>
<staticValue><button id="clearPromptsBtn" class="icdUI clsPromptButton" style="font-size: 90%; background-color:#dcdcdc; height: 24px">Clear</button>
<script>
var xfdf = { }
xfdf.hookEventHandler = function() {
var cleanerBtn = document.getElementById("clearPromptsBtn");
cleanerBtn.onclick = xfdf.clearValues;
}
xfdf.clearValues = function(eventObject) {
var oCR= cognos.Report.getReport("_THIS_");
var aPromptControls = oCR.prompt.getControls( );
for(var i=0; i<aPromptControls.length; i++) {
var p =aPromptControls[i];
p.clearValues();
}
xfdf.cancelBubble(eventObject);
return false;
}
xfdf.cancelBubble = function(eventObject) {
if (!eventObject) var eventObject = window.event;
if (eventObject.cancelBubble) eventObject.cancelBubble = true;
if (eventObject.stopPropagation) eventObject.stopPropagation();
xfdf.reprompt();
}
xfdf.reprompt = function(){
promptAction('Reprompt');
}
xfdf.hookEventHandler();
</script></staticValue>
</dataSource>
</HTMLItem></contents><style><CSS value="background-color:blue;height:30px;font-weight:bold;color:white;font-size:12pt"/></style></tableCell></tableCells></tableRow><tableRow><tableCells><tableCell><contents><selectValue multiSelect="true" name="id3" parameter="pCon" range="false" refQuery="クエリー2" selectValueUI="listBox"><useItem refDataItem="Country"/><style><CSS value="visibility:hidden;width:10px;height:1px"/></style></selectValue><HTMLItem>
<dataSource>
<staticValue><script language="javascript">
var fW = (typeof getFormWarpRequest == "function" ?
getFormWarpRequest() : document.forms["formWarpRequest"]);
if ( !fW || fW == undefined) { fW = ( formWarpRequest_THIS_ ?
formWarpRequest_THIS_ : formWarpRequest_NS_ );}
var var1=fW._textEditBoxid2;
var var2=fW._oLstChoicesid3;
function SplitText()
{
if ((var1.value=='')|| (var1.value==null))
{
alert("No values were entered! Please enter some values.");
}
else
{
var text_array=var1.value.split(" ");
var numberofsplits=0;
while (numberofsplits < text_array.length)
{
for (var i=0;i < var2.length; i++)
{
if(var2[i].value==text_array[numberofsplits])
{
var2[i].selected=true;
}
}
numberofsplits++;
}
promptButtonFinish();
}
}
</script></staticValue>
</dataSource>
</HTMLItem></contents><style><CSS value="height:1px"/></style></tableCell></tableCells></tableRow></tableRows></table></contents></tableCell></tableCells></tableRow><tableRow><tableCells><tableCell><contents><crosstab horizontalPagination="true" name="クロス集計1" refQuery="クエリー1">
<noDataHandler>
<contents>
<block>
<contents>
<textItem>
<dataSource>
<staticValue>データなし</staticValue>
</dataSource>
<style>
<CSS value="padding:10px 18px;"/>
</style>
</textItem>
</contents>
</block>
</contents>
</noDataHandler>
<style>
<CSS value="border-collapse:collapse"/>
<defaultStyles>
<defaultStyle refStyle="xt"/>
</defaultStyles>
</style>
<crosstabRows><crosstabNode><crosstabNestedNodes><crosstabNode><crosstabNodeMembers><crosstabNodeMember edgeLocation="e1" refDataItem="国"><style><defaultStyles><defaultStyle refStyle="ml"/></defaultStyles><CSS value="background-color:#99CCCC"/></style><contents><textItem><dataSource><memberCaption/></dataSource></textItem></contents></crosstabNodeMember></crosstabNodeMembers><crosstabNestedNodes><crosstabNode><crosstabNodeMembers><crosstabNodeMember edgeLocation="e4" refDataItem="収益"><style><defaultStyles><defaultStyle refStyle="ml"/></defaultStyles><CSS value="background-color:#CCCCFF"/></style><contents><textItem><dataSource><memberCaption/></dataSource></textItem></contents></crosstabNodeMember></crosstabNodeMembers></crosstabNode><crosstabNode><crosstabNodeMembers><crosstabNodeMember edgeLocation="e5" refDataItem="総利益"><style><defaultStyles><defaultStyle refStyle="ml"/></defaultStyles><CSS value="background-color:#CCCCFF"/></style><contents><textItem><dataSource><memberCaption/></dataSource></textItem></contents></crosstabNodeMember></crosstabNodeMembers></crosstabNode></crosstabNestedNodes></crosstabNode></crosstabNestedNodes><crosstabNodeMembers><crosstabNodeMember edgeLocation="e3" refDataItem="製品ライン"><style><defaultStyles><defaultStyle refStyle="ml"/></defaultStyles><CSS value="background-color:#66CCCC"/></style><contents><textItem><dataSource><memberCaption/></dataSource></textItem></contents></crosstabNodeMember></crosstabNodeMembers></crosstabNode></crosstabRows><crosstabColumns><crosstabNode><crosstabNodeMembers><crosstabNodeMember edgeLocation="e2" refDataItem="年"><style><defaultStyles><defaultStyle refStyle="ml"/></defaultStyles></style><contents><textItem><dataSource><memberCaption/></dataSource></textItem></contents></crosstabNodeMember></crosstabNodeMembers></crosstabNode></crosstabColumns><crosstabFactCell><contents><textItem><dataSource><cellValue/></dataSource></textItem></contents><style><defaultStyles><defaultStyle refStyle="mv"/></defaultStyles></style></crosstabFactCell></crosstab></contents></tableCell></tableCells></tableRow></tableRows></table></contents>
</pageBody>
<pageHeader><contents><image>
<dataSource>
<staticValue>../samples/images/ise.png</staticValue>
</dataSource>
<style><CSS value="width:1084px;height:60px"/></style></image></contents></pageHeader><pageFooter><contents/></pageFooter></page>
</reportPages>
</layout>
</layouts>
<XMLAttributes><XMLAttribute name="RS_CreateExtendedDataItems" output="no" value="true"/><XMLAttribute name="listSeparator" output="no" value=","/><XMLAttribute name="RS_modelModificationTime" output="no" value="2013-04-05T15:05:54.917Z"/></XMLAttributes><reportName>フリーワードで複数入力検索</reportName><queries><query name="クエリー1"><source><model/></source><selection><dataItem aggregate="none" name="国" rollupAggregate="none"><expression>[Sales (query)].[Employee by region].[Country]</expression><XMLAttributes><XMLAttribute name="RS_dataType" output="no" value="3"/><XMLAttribute name="RS_dataUsage" output="no" value="attribute"/></XMLAttributes></dataItem><dataItem aggregate="none" name="年" rollupAggregate="none"><expression>[Sales (query)].[Time].[Year]</expression><XMLAttributes><XMLAttribute name="RS_dataType" output="no" value="1"/><XMLAttribute name="RS_dataUsage" output="no" value="attribute"/></XMLAttributes></dataItem><dataItem aggregate="none" name="製品ライン" rollupAggregate="none"><expression>[Sales (query)].[Products].[Product line]</expression><XMLAttributes><XMLAttribute name="RS_dataType" output="no" value="3"/><XMLAttribute name="RS_dataUsage" output="no" value="attribute"/></XMLAttributes></dataItem><dataItem aggregate="total" name="収益"><expression>[Sales (query)].[Sales fact].[Revenue]</expression><XMLAttributes><XMLAttribute name="RS_dataType" output="no" value="2"/><XMLAttribute name="RS_dataUsage" output="no" value="fact"/></XMLAttributes></dataItem><dataItem aggregate="total" name="総利益"><expression>[Sales (query)].[Sales fact].[Gross profit]</expression><XMLAttributes><XMLAttribute name="RS_dataType" output="no" value="2"/><XMLAttribute name="RS_dataUsage" output="no" value="fact"/></XMLAttributes></dataItem></selection><detailFilters><detailFilter use="optional"><filterExpression>[国] in ?pCon?</filterExpression></detailFilter></detailFilters></query><query name="クエリー2"><source><model/></source><selection><dataItem aggregate="none" name="Country"><expression>[Sales (query)].[Employee by region].[Country]</expression></dataItem></selection></query></queries></report>