The Forms service lets you customize a toolbar that is rendered with an HTML form. A toolbar can be customized to alter its appearance by overriding default CSS styles and to add dynamic behavior by overriding Java scripts. A toolbar is customized by using an XML file named fscmenu.xml. By default, the Forms service retrieves this file from an internally specified URI location.
Note: This URI location is located in the adobe-forms-core.jar file, which is located in the adobe-forms-dsc.jar file. The adobe-forms-dsc.jar file is located in C:\Adobe\LiveCycle\deploy folder (C:\ is the installation directory). You can use a file extraction tool, such as Win RAR, to open the adobe.
You can copy the fscmenu.xml from this location, modify it to meet your requirements, and then place it in a custom URI location. Next, using the Forms Service API, set run-time options that result in the Forms service using your fscmenu.xml file from the specified location. These actions result in the Forms service rendering an HTML form that has a custom toolbar.
fscJS is the Java script that is associated with each node. It is necessary to supply one for the div#fscmenu node and optionally for ul#fscmenuItem nodes. The JS files implement core toolbar functionality and the default files work.
fscCSS is a style sheet that is associated with a particular node. The styles in the CSS files specify the toolbar appearance. fscVCSS is a style sheet for a vertical toolbar, which is displayed on the left of the rendered HTML form. fscIECSS is a style sheet used for HTML forms that are rendered in Internet Explorer.
Ensure that all the above files are referenced in the fscmenu.xml file. That is, in the fscmenu.xml file, specify URI locations to point to these files so that the Forms service can locate them. By default, these files are available at URI locations starting with internal keywords FSWebRoot or ApplicationWebRoot.
To customize the toolbar, replace the keywords by using the external keyword FSToolBarURI. This keyword represents the URI that is passed to the Forms service at run time (this approach is shown later in this section).
You can also specify the absolute locations of theseJS and CSS files, such as http://www.mycompany.com/scripts/
misc/fscmenu.js. In this situation, you do not need to use the FSToolBarURI keyword.
misc/fscmenu.js. In this situation, you do not need to use the FSToolBarURI keyword.
Note: It is not recommended that you mix the ways in which these files are referenced. That is, all URIs should be referenced by using either the FSToolBarURI keyword or an absolute location.
You can obtain the JS and CSS files by opening the adobe-forms-<appserver>.ear file. Within this file, open the adobe-forms-res.war. All of these files are located in the WAR file. The adobe-forms-<appserver>.ear file is located at C:\Adobe\LiveCycle\deploy folder (C:\ is the installation directory). You can open the adobe-forms-<appserver>.ear using a file extraction tool such as WinRAR.
<div id="fscmenu" fscJS="FSToolBarURI/scripts/fscmenu.js" fscCSS="FSToolBarURI/fscmenu.css" fscVCSS="FSToolBarURI/fscmenu-v.css" fscIECSS="FSToolBarURI/fscmenu-ie.css">
<ul class="fscmenuItem" id="Home">
<li>
<a href="#" fscTarget="_top" tabindex="1">Home</a>
</li>
</ul>
<ul class="fscmenuItem" id="Upload" fscJS="FSToolBarURI/scripts/fscattachments.js" fscCSS="FSToolBarURI/fscdialog.css">
<li>
<a tabindex="2">Upload Attachments</a>
<ul class="fscmenuPopup" id="fscUploadAttachments">
<li>
<a href="javascript:doUploadDialog();" tabindex="3">Add ...</a>
</li>
<li>
<a href="javascript:doDeleteDialog();" tabindex="4">Delete ...</a>
</li>
</ul>
</li>
</ul>
<ul class="fscmenuItem" id="Download">
<li>
<a tabindex="100">Download Attachments</a>
<ul class="fscmenuPopup">
<li>
<a tabindex="101">None available</a>
</li>
</ul>
</li>
</ul>
</div>
|
•
|
Change the values of fscJS, fscCSS, fscVCSS, fscIECSS attributes (in the fscmenu.xml file) to reflect the custom locations of the referenced files by using one of the methods that are described in this section (for example, fscJS="FSToolBarURI/scripts/fscmenu.js").
|
|
•
|
All the CSS and JS files must be specified. If none of the files are modified, provide the default one at the custom location. You can obtain the default files by opening various files as described in this section.
|
|
•
|
Providing an absolute reference (for example, http://www.example.com/scripts/
custom-vertical-fscmenu.css) for any file is allowed. |
|
•
|
The JS and CSS files that the div#fscmenu node requires are essential for toolbar functionality. Individual ul#fscmenuItem nodes may or may not have supporting JS or CSS files.
|
As part of customizing a toolbar, you can change the locale value of the toolbar. That is, you can display it in another language. The following illustration shows a custom toolbar that is displayed in French.
Note: It is not possible to create a custom toolbar in more than one language. Toolbars cannot use different XML files based on the locale settings.
To change the locale value of a toolbar, ensure that the fscmenu.xml file contains the language you want to display. The following XML syntax shows the fscmenu.xml file that is used to display a French toolbar.
<div id="fscmenu" fscJS="FSToolBarURI/scripts/fscmenu.js" fscCSS="FSToolBarURI/fscmenu.css" fscVCSS="FSToolBarURI/fscmenu-v.css" fscIECSS="FSToolBarURI/fscmenu-ie.css">
<ul class="fscmenuItem" id="Home">
<li>
<a href="#" fscTarget="_top" tabindex="1">Accueil</a>
</li>
</ul>
<ul class="fscmenuItem" id="Upload" fscJS="FSToolBarURI/scripts/fscattachments.js" fscCSS="FSToolBarURI/fscdialog.css">
<li>
<a tabindex="2">Télécharger les pièces jointes</a>
<ul class="fscmenuPopup" id="fscUploadAttachments">
<li>
<a href="javascript:doUploadDialog();" tabindex="3">Ajouter...</a>
</li>
<li>
<a href="javascript:doDeleteDialog();" tabindex="4">Supprimer...</a>
</li>
</ul>
</li>
</ul>
<ul class="fscmenuItem" id="Download">
<li>
<a tabindex="100">Télécharger les pièces jointes</a>
<ul class="fscmenuPopup">
<li>
<a tabindex="101">Aucune disponible</a>
</li>
</ul>
</li>
</ul>
</div>
Note: The Quick Starts that are associated with this section use this XML file to display a French custom toolbar, as shown in the previous illustration.
Also, specify a valid locale value by invoking the HTMLRenderSpec object’s setLocale method and passing a string value that specifies the locale value. For example, pass fr_FR to specify French. The Forms service is bundled with localized toolbars. (See LiveCycle ES Java API Reference.)
Note: Before you render an HTML form that uses a custom toolbar, you must know how HTML forms are rendered. (See Rendering Forms as HTML.)
Include the necessary files in your development project. If you are creating a client application by using Java, include the necessary JAR files. If you are using web services, include the proxy files.
Before you can programmatically perform anoperation that the Forms service supports, you must create a Forms client object.
To render an HTML form that contains a custom toolbar, reference a fscmenu XML file that describes the toolbar. (This section provides two examples of a fscmenu XML file.) Also, ensure that the fscmenu.xml file specifies the locations of all referenced files correctly. As mentioned earlier in this section, ensure that all files are referenced by either the FSToolBarURI keyword or their absolute locations.
To render an HTML form, specify a form design that was created in LiveCycle Designer ES and saved as an XDP file. Also select an HTML transformation type. For example, you can specify the HTML transformation type that renders a dynamic HTML for Internet Explorer 5.0 or later.
When the Forms service renders an HTML form, it returns a form data stream that you must write to the client web browser to make the HTML form visible to users.