I have a simple report with two filters (&COUNTRY and &BODYTYPE) which create respective multiselect dropdowns in a designer page.

-DEFAULT &COUNTRY = _FOC_NULL;
-DEFAULT &BODYTYPE = _FOC_NULL;
TABLE FILE CAR
BY CAR.ORIGIN.COUNTRY
BY CAR.COMP.CAR
BY CAR.CARREC.MODEL
BY CAR.BODY.BODYTYPE
WHERE CAR.ORIGIN.COUNTRY EQ &COUNTRY.(OR(FIND CAR.ORIGIN.COUNTRY,CAR.ORIGIN.COUNTRY IN car|FORMAT=A10)).Country:.;
WHERE CAR.BODY.BODYTYPE EQ &BODYTYPE.(OR(FIND CAR.BODY.BODYTYPE,CAR.BODY.BODYTYPE IN car|FORMAT=A12)).Body Type:.;
ON TABLE SET PAGE-NUM NOLEAD
ON TABLE SET ASNAMES ON
ON TABLE NOTOTAL
ON TABLE PCHOLD FORMAT HTML
ON TABLE SET HTMLEMBEDIMG ON
ON TABLE SET HTMLCSS ON
ON TABLE SET STYLE *
INCLUDE = IBFS:/EDA/EDASERVE/_EDAHOME/ETC/warm.sty,
$
ENDSTYLE
END

I am trying to pass the parameter values to another procedure (cardetail.fex) that looks like

-DEFAULT &COUNTRY = _FOC_NULL;
-DEFAULT &BODYTYPE = _FOC_NULL;
-TYPE Countries selected are: &COUNTRY
-TYPE Body Types selected are: &BODYTYPE


Below is the javascript I added in the designer page to call cardetail.fex and pass parameters to it. However, I get inputVal as undefined. Could someone help me pass &COUNTRY and &BODYTYPE variables to the URL?

window.addEventListener("iba_pageloading", function (e){
var panel = document.querySelector(".carFile").ibaObject; // carFile is the class name I gave to the panel that has the report output
var ibsite = panel.addButton({
"glyphClasses": "fa fa-home", "class": "ibButton", "tooltip": "Click to display help."},
".pd-container-title-button-resize", true);
ibsite.addEventListener("click", function(){
var url = '/ibi_apps/WFServlet.ibfs?IBFS1_action=RUNFEX&IBFS_path=IBFS:/WFC/Repository/test/cardetail.fex' ;
url = url + '&COUNTRY=' ;
alert (url);
var inputVal = document.getElementsByClassName("countryVal").value; // countryVal is the class name I gave to the filter dropdown of &COUNTRY
alert(inputVal);
window.open(url);

});
var runReport = panel.addMenuItem({
"text": "Country Report", "glyphClasses": "fa fa-globe","class": "globemenu"},
".carFile>.ibx_menu_item", true);
runReport.addEventListener("click", function(){
window.open(
"https://www.google.com/");
});
});

Thanks!

This message has been edited. Last edited by: FP Mod Chuck,

Try this instead to retrieve countryVal

var inputVal = IbComposer_getCurrentSelection('countryVal');

I don't think Composer calls will work with Designer.

quote:

Originally posted by Waz:
I don't think Composer calls will work with Designer.

If it's the case then it's going to be an issue when migrating from AS to Designer...if ever it's possible...

Martin,

var inputVal = IbComposer_getCurrentSelection('countryVal'); -- Did not work. It is throwin a Javascript Reference error: IbComposer_getCurrentSelection is not defined.

Martin and Waz any other ideas on how I can accomplish this?

Thanks!

Designer is a completely new beast.

There is information beginning to show up related to js etc. But there doesn't seem to be much.

We were even thinking of using composer pages in an interim to drive the reports and charts in designer, but at the time there was no way to "inject" the parameters easily or nicely.

Not sure of the state is now.

I have seen a list of short videos on how-to's related to designer, but not sure where it is.

Will update if I find it.

You can find videos on WebFOCUS Designer here: Designer videos and you can also find these on YouTube.

quote:

Originally posted by Michele Brady:
You can find videos on WebFOCUS Designer here: Designer videos and you can also find these on YouTube.

Thank you Michele. I couldn't find any video related to my specific issue which is getting parameter values from designer page.

Is there someone in Product I could reach out to?

Radhika005

You will need to open a case with techsupport to get additional help.

Looks like John Lewis had already worked on this. I also opened a case to see if IBI has a simpler solution to this with some IBI functions.

Below is the Javascript that I borrowed from John to make it work for this example. Also the values passed into the url will be the display values.

window.addEventListener("iba_pageloading", function (e){
var panel = document.querySelector(".carFile").ibaObject; // carFile is the class name I gave to the panel that has the report output
var ibsite = panel.addButton({
"glyphClasses": "fa fa-home", "class": "ibButton", "tooltip": "Click to display help."},
".pd-container-title-button-resize", true);
ibsite.addEventListener("click", function(){
exportExcelRpts();
});

var runReport = panel.addMenuItem({
"text": "Country Report", "glyphClasses": "fa fa-globe","class": "globemenu"},
".carFile>.ibx_menu_item", true);
runReport.addEventListener("click", function(){
window.open(
"https://www.google.com/");
});

});
function exportExcelRpts(){
var url = '/ibi_apps/run/IBFS/WFC/Repository/test/cardetail.fex' ;
url = url + '?COUNTRY=' + getDDValue('countryval','ms') ; //countryval is the class name I gave to the &COUNTRY filter dropdown
url = url + '&BODYTYPE=' + getDDValue('bodytypeval','ms') ; //bodytypeval is the class name I gave to the &BODYTYPE filter dropdown
window.open(url);
}
function getDDValue(dd,f){
var dd = document.getElementsByClassName(dd)[0].children[0];
var dd1 = dd.children[1];
var dd2 = dd1.children[0];

var retValue;
if(f=="s") return dd2.value;
else
{
if(f=="m") return repCWOr(dd2.value);
else
{
if(f=="ms") retValue = repCWOr(dd2.value);
if((f=="ms") && (retValue=="'_FOC_NULL'")) return retValue;
}
}

var dd2a = dd1.children[6];
var dd3 = dd2a.children[0];
var dd4 = dd3.children[1];
var op="";
for(i=0;ivar _t=dd4.children[i].getAttribute("aria-checked");
if(_t=="true"){
op = op+","+dd4.children[i].children[3].innerHTML;
}
}
var tArr=[];
opa=op.split(",");
opa.shift();
for(i=0;i opa[i] = "'" + opa[i] + "'";
if(opa=="'All'")
tArr[0] = "'_FOC_NULL'";
else{
tArr = opa.join(" OR ")
}
return tArr;
}
function repCWOr(v){
if(v=='All'){
v='_FOC_NULL';
}

var _t = v.split(',');
if(_t.length<2) return "'"+v+"'";
for(i=0;i<_t.length;i++){
_t[i]=myTrim(_t[i]);
_t[i] = "'"+_t[i]+"'";
}
var _r = _t.join(" OR ");
return _r;
}
function myTrim(x) {
return x.replace(/^\s+|\s+$/gm,'');
}