Posted at

Cognos プロンプトに複数フリーワード入力を実装する

More than 1 year has passed since last update.


概要

テキストボックスのプロンプトに、以下のように、ブランク区切りで複数の検索ワードをフリー入力し、絞込みを行う機能をJavaScriptを用いて実装する例です。

image.png


実装方法

Report Authoringの定義は以下のイメージです。

パッケージは「GO データ ウェアハウス (クエリー)」を使用しています。

image.png

① テキストボックスのプロンプト

国名をブランク区切りでフリー入力するためのプロンプト

② 複数選択の値のプロンプトを非表示としている

①で入力されたワードを、③の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>&lt;input type="BUTTON" class="clsPromptButton" style="font-size: 90%; background-color:#dcdcdc; height: 24px" onClick="SplitText()" value=" Finish "&gt;</staticValue>
</dataSource>
</HTMLItem><HTMLItem>
<dataSource>
<staticValue>&lt;button id="clearPromptsBtn" class="icdUI clsPromptButton" style="font-size: 90%; background-color:#dcdcdc; height: 24px"&gt;Clear&lt;/button&gt;

&lt;script&gt;
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&lt;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();

&lt;/script&gt;</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>&lt;script language="javascript"&gt;
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 &lt; text_array.length)
{
for (var i=0;i &lt; var2.length; i++)
{
if(var2[i].value==text_array[numberofsplits])
{
var2[i].selected=true;
}
}
numberofsplits++;
}
promptButtonFinish();
}
}
&lt;/script&gt;</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>