Presentation is loading. Please wait.

Presentation is loading. Please wait.

Barry Solomon Information Builders, Inc. Inside Look at Chaining HTML Composer 1.

Similar presentations


Presentation on theme: "Barry Solomon Information Builders, Inc. Inside Look at Chaining HTML Composer 1."— Presentation transcript:

1 Barry Solomon Information Builders, Inc. Inside Look at Chaining HTML Composer 1

2 Hi my name is Barry Solomon and I have been with Information Builders for four years. Some of you may know me as a voice on the phone. When you have a problem with WebFOCUS you sometimes get me to work on your issue when opening a case with tech support. I started coding in WebFOCUS back in 2002 and never used the GUI tools to do much. Programmers dont use that stuff and now I preach that you should use the GUI when working with the HTML Composer. Go Figure!!! It should be noted that you should not modify the HTML Code that the HTML Composer, for it will cause serious issues with the conversion of the file in future releases. However it should be noted that a developers can modify the properties in the HTML Code at runtime using JavaScript so you really do not loose any functionality or flexibility by not modifying the HTML code. 2

3 The HTML Composer The HTML Composer enables you to build HTML Applications. Graphically create an HTML page in the GUI that incorporates Forms Reports Graphs JavaScript Cascading Style Sheets (CSS) We will be discussing the subject of Chaining today 3

4 Inside Look at Chaining Agenda Inside Look at Chaining in the HTML Composer page using WebFOCUS Building a Procedure to use when creating an HTML page. Simplicity of Chaining Columns. Modifying embedded procedures with chaining and discover what happens. Exploring the use of external procedures for chaining which will allow developers to reuse procedures. How to use API Functions to impact chaining. 4

5 Building a Procedure to create an HTML page using Chaining Best Practice: Building an HTML Page: Build a procedure that has all the parameters built into the procedure and has all the necessary parameters to create the HTML page you are building. The procedure does not need to be the procedure that is ultimately executed from the HTML page but is required to have all the parameters included to build the HTML page. Best Practice to use -DEFAULT command in your procedures to create a parameter which will be used in the HTML Composer Page. Use –DEFAULTH for all parameters that the developer does not want to have a control build by the HTML Composer Tool. With Chaining a Multiple OR statement is required (in our example), uses the following syntax: WHERE ( CAR.ORIGIN.COUNTRY EQ &COUNTRY. (OR(FIND CAR.ORIGIN.COUNTRY,CAR.ORIGIN.COUNTRY IN car)).COUNTRY. ) Note: a naming convention should be chosen carefully. If two or more procedures use the same parameter names the HTML Composer will only create one control for all the reports. If the parameters are named differently, the HTML Composer will create two different controls. 5

6 Building a Procedure to create an HTML page using Chaining Under most circumstances do not add JavaScript code in the function window_onload. The only time that a Developer should insert JavaScript code in window_onload is when it is required to set properties such as AutoExecute properties that controls whether a report is executed automatically when the HTM page is loaded. AutoExecute must be set before UpdateData() is called. The function window_onload calls, UpdateData(), that is executed on the load of the HTM page or when refreshing the page. UpdateDatas purpose is to load all the controls, forms, reports and set their respective properties. Once UpdateData has completed its tasks, it will then search the HTM page for a function called onInitialUpdate(). Function onInitialUpdate() was designed solely for the use of the Developer to change the HTM pages properties and appearances when the page, control, form, and or reports when initially loaded or refreshed. Do not EDIT or MODIFY the HTML Code, you can Modify HTML properties using JavaScript code. 6

7 Building a Procedure to create an HTML page using Chaining 1. Create a new procedure. 2. Name the procedure chaining. 3. We will step through the building of the chaining report in the following slides. 4. Things to note about the procedures source code are: The WHERE clause contains three Multiselect OR requests that will be used to demonstrate CHAINING. 7

8 Building a Procedure to create an HTML page using Chaining Step 1: Once in the Report Painter click on the BY button in the tool bar (circled in red below) and then double click COUNTRY, CAR, MODEL, BODY TYPE, and SEATS columns in the left pane labeled Object Inspector (The Fields tab will be selected by default) and they will be entered on the canvas 8

9 Building a Procedure to create an HTML page using Chaining. Step 2: Now Select the SUM button in the toolbar (circled in red below) and double click on the Dealer_Costs, Retail_Costs, and Sales columns in the left pane labeled Object Inspector (The Fields tab will be selected by default) and they will be entered on the canvas, just like Step 1. 9

10 Building a Procedure to create an HTML page using Chaining 10 Step 3: Click the Where/If button to filter by COUNTRY, CAR, and MODEL. By setting up the Where clauses we will be able to do chaining in the HTML Compose r page.

11 Building a Procedure to create an HTML page using Chaining. 11 Step 4: Click the Where/If button to filter by COUNTRY, CAR, and MODEL. By setting up the Where clauses we will be able to do chaining in the HTML Compose r page. The Expression Builder will assist you in creating the WHERE Clause. a) Double click on COUNTRY. b) Set the Logical Relation to equals. c) Set the Compare Type to Parameter. d) Double click on the text under Compare Value e) Set Variable Type to Multiselect OR f) Set Accept List to Dynamic. g) Select Car as the Source File. h) Select COUNTRY as the Values to Return Fields and Values for Display Fields. i) Repeat step a – h for CAR and MODEL.

12 Building a Procedure to create an HTML page using Chaining. 12 This will finish the chaining report and you can save the procedure now.

13 Building a Procedure to create an HTML page using Chaining Step 2: Create a new HTML Composer page and name the HTM page, chaining and click the Cancel button. Insert a report or graph object by doing the following: Click the Report button from the Components toolbar. The mouse pointer will turn to a crosshair when moved to the canvas. Click the Left mouse button and drag the mouse to create the space for the report. Right click on the report and select Reference Existing Procedure Choose the chaining.fex that was created in Step 1. 13

14 Building a Procedure to create an HTML page using Chaining Step 3: The New Parameter screen will allow the HTML Composer Tool to create all the parameters automatically. Proper Control Types must be selected Check the appropriate controls that will be chained. New single layer form should be chosen. If Do not create a form is chosen the Refresh button will not be added to the page. 14

15 Building a Procedure to create an HTML page using Chaining Step 4: Click the OK button and the HTML Composer Tool will create the HTML page and all the internal references for the form. It is critical that the HTML Composer builds the HTML tags and all references. Note: In WebFOCUS 8, the HTML code will not be accessible. If the HTML code is modified the division will not support the report that was created. 15 The final HTM page will appear like the following screen print:

16 Building a Procedure to create an HTML page using Chaining Notice that the Chaining was automatically created for us and there is nothing else that is necessary to do at this point. Run the chaining HTM page and see it work. However lets make a modification to the embedded procedure used to fill the control for COUNTRY and exclude FRANCE from the control. Select the control and go to the Properties and setting window. The Procedure will be modified in the following manner: TABLE FILE car SUM FST.CAR.ORIGIN.COUNTRY BY CAR.ORIGIN.COUNTRY WHERE COUNTRY NE 'FRANCE'; // TODO: Add your filters here to replace defaults ON TABLE PCHOLD FORMAT XML END CHAINING is broken. Now lets run the HTM page and notice when we click on ENGLAND CAR control does not work and CHAINING is broken. What did we do??????? What did we do??????? 16

17 Building a Procedure to create an HTML page using Chaining The Answer: Once you change/modify the embedded procedure (s), the HTML Composer no longer controls the chaining and the embedded procedure(s) for the HTM page. You will now have to modify and control the chaining manually. The embedded procedure for CAR will have to be modified in the following manner: TABLE FILE car SUM FST.CAR.COMP.CAR BY CAR.COMP.CAR BY COUNTRY // TODO: Add your filters here to replace defaults ON TABLE PCHOLD FORMAT XML END OR 17

18 Sharing parameters between focexecs TABLE FILE car SUM FST.CAR.COMP.CAR BY CAR.COMP.CAR WHERE COUNTRY EQ &CNTY // TODO: Add your filters here to replace defaults ON TABLE PCHOLD FORMAT XML END Now you have to control it The reason for the modification is that the procedure for COUNTRY was originally modified so the HTML Composer expects that the developer will now control the chaining and the automatic chaining that was taken place is no longer valid. Now you have to control it….. 18

19 Controlling the relationship of chaining controls Click on the Parameter tab at the bottom of the screen and you will see the following: 19 Notice that the blue line in the picture above represents a relationship between listbox1 (COUNTRY) and listbox2 (CAR). When you right click on the arrowhead pointing to listbox2, you will be able to choose the Property and settings screen which displays all the properties of the chained relationship. We want to pay close attention to the value of Resolves parameter

20 Controlling the relationship of chaining controls 20 The value from listbox1 will be compared to the Column or Amper Variable listed in the Resolves parameter. The Column or Amper variable listed in the Resolves parameter textbox will be compared by the value in the textbox of the Parameters compare operator That means that the Column or Amper variable must be present in the embedded or external procedure used to retrieve the values for the control. In this case we added BY COUNTRY or WHERE COUNTRY EQ &CNTY and the procedure had to be modified and the Resolves parameter has to list COUNTRY or CNTY to match the modification we made in the embedded procedure. Now if we run the HTM page – Chaining will work again.

21 Using External procedures for chaining External Procedures can be used in place of an embedded procedure without an issues. External Procedures should be used if you choose to custom code a procedure. It is highly recommended to have an embedded procedure created within the Report Painter and custom coding techniques should not be used. When writing an external/embedded procedure, it is recommended not to use NOPRINT in the final TABLE request. 21

22 Inside Look at Chaining In WebFOCUS 77X/HTML Composer Tool has exposed a number of API functions that can be used in JavaScript functions that will allow you to customize an HTM Page and impact chaining. Function: IbComposer_getCurrentSelection Function: IbComposer_setCurrentSelection Function: IbComposer_execute Function: IbComposer_isSelected Function: IbComposer_showHtmlElement Function: IbComposer_enableHtmlElement Function: IbComposer_ResetDownChainControls Function: IbComposer_selectTab Event: onbeforeload Event: onafterload The exposed functions in WebFOCUS 77X should be used rather than calling the functions within the HTML Composer - JS library directly or writing extensive JavaScript code. Using the above functions assure that your code will continue to function in future releases. 22

23 Inside Look at Chaining The IbComposer_setCurrentSelection is a very powerful function to use with Chaining. How to Set the Current Selected Value for a Control IbComposer_setCurrentSelection('controlID', arrValues, bUpdateDependencies); The Control Id is a unique identifier of the control to be changed. The ArrValues is a value or an array of values that will be selected or added to the control. bUpdateDependencies is a true/false value or an operator that can be set to true to update chained controls and triggered events. This feature can be very helpful in navigating the HTM page with chaining. 23

24 Inside Look at Chaining – An API Function We are going to use an API Function to affect the Chained controls. Add the following code after window_onload and before the tag: function onInitialUpdate(){ var cntyval ='ENGLAND'; IbComposer_setCurrentSelection('listbox1', cntyval, true); } The var cntyval will hold the value that we are going to select in listbox1 and cause listbox2 to repopulate based on ENGLAND This single command in JavaScript does a lot of work and it demonstrates how powerful the API Functions can be. 24

25 WebFOCUS 8 – This is the new Template Selector 25

26 WebFOCUS 8 – This is the new Canvas screen Notice that the Tabs have changed (Embedded JavaScript) 26

27 WebFOCUS 8 – When clicking on the Embedded JavaScript 27

28 WebFOCUS 8 – The New Properties and settings screen Notice the last check box 28 The Values are procedure names is the New feature in WebFOCUS 8 that will allow you to dynamically change the procedure name that is to be executed …

29 Advanced Search Screen https://techsupport.informationbuilders.com/tech/search.html 29

30 Technical Documents available https://techsupport.informationbuilders.com/tech/tcn_toc.html 30

31 Technical Documentation Library d=aa307ee48d981f18d d 31

32 The HTML Composer Presentation – Question and Answers I hope that you have enjoyed the presentation and it has been informative. If you have any questions, please feel free to ask QUESTIONS, Questions are good. 32 Please be sure to fill out the evaluation form. When building your HTML Composer pages remember to ask questions on FOCAL POINT or open a Case in Technical Support and we will be happy to help


Download ppt "Barry Solomon Information Builders, Inc. Inside Look at Chaining HTML Composer 1."

Similar presentations


Ads by Google