HTML FAQ / Knowledge Base

Relative References in CSS Stylesheets.

In stylesheets if you want to reference an external resource (say an image) then the URL you enter is either absolute (not recommended) or is relative to the stylesheet itself (not relative to the webpage or the base element href value!). For example to set a background image you might have a snippet in your stylesheet of:

1:
2:
3:
4:
5:
6:
body.frooble {    
 font-size: 60px;     
 color:#000000;    
 background-image: 
 url("Images/chair.jpg"); 
}

which means that you should create a sub folder underneath the folder you are storing the stylesheet in, and upload an image to it called 'chair.jpg' (folders and file names are not case-sensitive).

Your html may contain this:

1:
2:
3:
4:
5:
6:
7:
<head>         
     <link rel="stylesheet" type="text/css" href="Stylesheets/masterss_v8 - BLUE.css" />
     <base href="https://flm00.w4.local:443/sap/bc/bsp/flm/portal" target="_self" />     
</head>     
<body class="frooble">      
     <span id="title">      Holiday Request Form      </span>     
</body>

and so you would have a folder called 'Stylesheets' containing the actual CSS and a subfolder called 'Images' with the jpeg in there to make this work. Other links in the HTML are relative to the base/href URL.

 

Why aren't my script libraries from the SAP MIME repository getting executed?

This could be because you have referenced them like this:

<script type="text/javascript" src="CalendarPopup.js"/>

..which for does not work. Change to:

1:
2:
3:
 <script type="text/javascript" src="CalendarPopup.js">

     </script>

and make sure that there is a blank in between the open and close tag.

 

How do I set up SAP ABAP Web Services on my Form?

1) Configure your ABAP web service as normal, including the SOAMANAGER component with Service and Endpoint.

In this example the function module in SAP has two parameters:   IM_IN and EX_OUT.  These will be mapped into "webservice friendly" names by SAP to "ImIn" and "ExOut" - see the WSDL file to get those names for your function under the 'Element name' hierarchy.

2) Add "meta" nodes to your template, 1 per webservice you wish to connect to, as follows:

1:
2:
3:
4:
5:
6:
7:
<head> 
   . 
   . 
   <meta id="SAPWebService1" name="ZmyHtmlWS" content=""/> 
   . 
   . 
</head>

The "id" must begin "SAPWebService" (not case sensitive) and then any string (recommendation is to use a single numeric digit) and the "name" is the top-level "Element Name" node from the WSDL (that is the "element name" of the request element, not the response element).  FLM will then fill the "content" node with the correct URL as the form is rendered, taking into account the local SAP system details.

There are some OPTIONAL attributes you may add to fine tune the URL of the webservice as follows:

1:
2:
3:
4:
<meta.... https = "X" /> //web service is an 'https' service, default is 'http'
<meta.... version = "2.0" /> //wsdl is version '2.0', default is '1.1' 
<meta.... format = "standard" /> //wsdl format is 'standard', default is ' ws_policy ' 
<meta.... style = "rpc" /> //wsdl style is 'rpc', default is 'document'

     (See SAP Type Group TSRTP for alternate options to many of these parameters).

If you do not wish the system to replace the content node with a generated URL, simply add the 'no_sap_rehost' attribute as follows.  You would use this if your web service is a non-SAP one or for some other reason (such as you wanted the webservice from the SAP PRD system to run against the SAP QA system).  In this case you are responsible for determining the content URL yourself and entering it into the form:

1:
2:
3:
4:
5:
6:
7:
<head>
   .
   .
   <meta id="SAPWebService1" name="ZmyHtmlWS" content="" no_sap_rehost="X"/>
   .
   .
</head>

3) In the javascript function that calls the webservice, add the following code into a script section in the header:

1:
2:
3:
4:
5:
6:
7:
8:
9:
10:
11:
12:
13:
14:
15:
16:
17:
18:
19:
20:
21:
22:
23:
24:
25:
26:
27:
28:
29:
30:
31:
32:
33:
34:
35:
36:
37:
<head>
    <script type="text/javascript">

      function myWebServiceFunction() {

        var f1 = document.getElementById("001").value;       //Source field from your form with ID="001"

        var cresult = new SOAPClientParameters();            //Initialize the SOAP interface

        cresult.add("ImIn", f1);                             //Add the source field ImIn to the SOAPInterface

        SOAPClient.SAPresultfield = "ExOut";                 //Add the result field ExOut to the SOAPInterface

        var url = get_meta_content_by_id('SAPWebService1');  //returns the full URL including binding key 

        var method = get_meta_name_by_id('SAPWebService1');  //returns the wsdl method 

        SOAPClient.invoke(url, method, cresult, true, myWSCallBack, true);    
                             
            // parameters are: url = URL of WSDL generated by FLM
            // method = Webservice operation to execute                
            // cresult = name of SOAP interface parameter
            // true = indicates asynchronous call (false = synchronous call)
            // myWSCallBack = Javascript function to call once the WS has run if asynchronous
            // true = indicates that this is an SAP web service

    }  


     function myWSCallBack(result) {

        document.getElementById("002").value = result;     //Put the returned value into the field with an ID = "002"

    }

    </script>
</head>
 

4) Ensure that you have the soapclient.js script library uploaded or transported into your FLM MIME repository and the FLM master javascript library, which contains the functions "get_meta_content_by_id" and "get_meta_name_by_id"

5) On your form you will have at least two fields (only the minimum set of attributes are shown here):

    a) the source field:

<input id="001" type="text" onblur="javascript:myWebServiceFunction();" />

    b) the result field:

<input id="002" type="text" />

6) At the time of writing web services only operate correctly when the FLM Portal is running in HTTP mode (19/3/12)

Why has my form disappeared?

1) Script tags like this:

<script type="text/javascript" src="CalendarPopup.js"/>

  can cause everything to disappear - change them to:

1:
2:
<script type="text/javascript" src="CalendarPopup.js">
 </script>

2) If you are using Aptana, switch off the option "Do not wrap text in simple tags"

  •     this can be found in menu : windows/preferences/aptana/Editors/HTML/Formatting/Edit

3) Empty style tags like this:

<style type="text/css"></style>

    can also cause everything to disappear. Delete such tags, or add some comments in between the opening and closing tags.

Why has my local script stopped being executed?

If your script contains the CDATA declarations, then remove them! :

1:
2:
3:
4:
5:
<script> 
<![CDATA[ <----remove this 
   function matchwo(a,b) { if (a < b && a < 0) then { return 1; } else { return 0; } } 
]]> <----and this 
</script>

Checkboxes cause PDF equivalent forms to not render  - why is this

If you author a form in PDF, ensure that any checkboxes you put on the form have the following attributes:

On Value = "on"

Off Value = ""

This is because HTML can only produce these values for checkboxes, and if you try and subsequently merge a data set from an HTML with a PDF form, ADS will produce a render error:

Processing exception during a "Render" operation.

Request start time: Tue Apr 24 17:07:47 BST 2012

com.adobe.ProcessingException: com.adobe.ads.exception.TransientException: A problem was encountered with the results: RenderResult array is null.; [Error Log file "2012.04.24.170751USER2.pdf" written to C:\usr\sap\DV1\SYS\global\\AdobeDocumentServices\renderErrorLog\errorFiles]

Portal buttons don't work (and other odd behaviours) in IE9?

Check your compatibility mode!  

In IE and when SAP is over NW 700 SP25,  this mode should be switched off. 

Press 'alt' in IE to reveal the menu.

 

Why are my repeating rows not working correctly?

Comments inside tables seem to cause unpredicable table behaviour.

Remove any such comments if there are any on your template.