Focal Point
[SOLVED]how to call the fex file name within javascript validation in html composer

This topic can be found at:
https://forums.informationbuilders.com/eve/forums/a/tpc/f/7971057331/m/4037080286

April 29, 2016, 07:18 AM
info4pal
[SOLVED]how to call the fex file name within javascript validation in html composer
Hi,

Iam using html composer and I have a dropdown box having the values(A,B,C,D etc) and I have a graphical report
which displays within the report layout which is just below the dropdown box in the html composer.

Now I need to add a javascript validation wherein onclick of the values in the dropdown list,
my graphical report(fex1) needs to be changed dynamically based on the values selected in the dropdown and
Iam not sure how to call the fex file name within the javascript .

Below is the piece of code which iam using in javascript :

function dropdown_OnClick(ctrl)
{
document.getElementById("report1") = fex1;
}

Could anyone please let me know how to call the fex file name within the javascript?
Thanks a lot in advance.

Thanks!

This message has been edited. Last edited by: info4pal,


Webfocus 8105 Developer studio,Windows 7,HTML,Excel,PDF,Text,Infoassist,Graph,AHTML
April 29, 2016, 09:39 AM
Squatch
By "graphical report" do you mean a graph/chart? I will assume it is a chart (fex).

Usually a chart fex will accept one or more parameters, and HTML Composer can suggest a control for you based on that (Such as a dropdown box) and take care of the linking between the control and the chart fex.

But since you are hinting that you need to do validation, I'll assume you need to write some extra code that will run after the dropdown selection changes but before the chart fex runs.

So here's how this can be done:

function combobox1_ononafterload(ctrl) {
    load_chart();
}

function combobox1_onchange(event) {
    load_chart();
}

function load_chart() {
    var selected = document.getElementById("combobox1").value;

    // Your validation code goes here. If something isn't correct, put in code that alerts the user and then skip the last two lines in this function, like so:
    //
    // alert("That is not valid, shame on you");
    // return;
 
    var url = "/ibi_apps/WFServlet.ibfs?IBFS1_action=RUNFEX&IBFS_path=/WFC/Repository/balanced_scorecard/~sharpet/car_sales_chart.fex&CAR=" + encodeURIComponent(selected);
    document.getElementById("chart1").src = url;
}

For my example, "combobox1" is the ID of the dropdown control. It has the names of all the cars in IBI's sample CAR file.

I inserted a chart component below this dropdown box, and imported a bar chart into it referenced an existing procedure (chart fex) that also uses IBI's sample CAR file. The chart accepts the name of a car and returns sales information for it.

You do not need the "onclick" event for the dropdown control. Use "onafterload" and "onchange" instead. Both will call the custom "load_chart" function that passes the value in the dropdown box to the chart fex. The "onafterload" is needed because the dropdown box will probably show a default selection, and you will want the chart to reflect that default selection right after the page loads.

When you insert a chart component into an HTML Composer page, you are actually inserting an HTML "iframe" tag (In this case, with an ID of "chart1"). The nice thing about iframes is that they have a property called source ("src" is the actual property name). Source is a hyperlink to more HTML code (i.e., a "URL"). Because of the way WebFOCUS works, it is possible to form a hyperlink to a fex file that exists in the Content area of WebFOCUS. You do so with a WFServlet command, then change the iframe's source property to point to that hyperlink/URL. The dropdown selection will be part of the URL that is formed, and will be passed into the chart fex as a parameter.

In this example, that parameter is called "CAR". The "encodeURIComponent" JavaScript function just ensures that the parameter being passed in the URL conforms to the rules regarding special characters in URLs/hyperlinks.

The "IBFS_path" in my example is one that is on the WebFOCUS system I work with. You will need to change it according to the location of your fex file. You may have Content subfolders to include in the IBFS_path as well, depending on the location of your fex file.

var url = "/ibi_apps/WFServlet.ibfs?IBFS1_action=RUNFEX&IBFS_path=/WFC/Repository/YOUR_CONTENT_FOLDER/YOUR_FEX_FILE.fex&CAR=" + encodeURIComponent(selected);

This message has been edited. Last edited by: Squatch,


App Studio
WebFOCUS 8.1.05M
Windows, All Outputs
May 19, 2016, 07:34 AM
info4pal
Thanks a lot Squatch for the reply !!
It helped Smiler

Regards!