HowTo:Create Application-Specific Help
About Application-Specific Help
The information here in the support wiki is intended primarily for application builders, admins, and installers. But end-users need information that is specific to the application they are using--and that is where application-specific help comes in.
In this article, we assume that you know how to add a button to a form, and that you know how to create an interface tab that displays a single HTML page of information. (The important point is to make sure that your help pages have no headers, so that links work.) With those basics in hand, you can go on to create context-sensitive help pages for your application.
Learn more:
Working with Application-Specific Help
Here, we assume that you want to display different pages, depending on the user's current location--so you'll be wiring help buttons that appear on different forms so they display different pages in the help tab. (You may even use JavaScript to go to different help pages, under different conditions.)
Tip: JavaScript functions are most easily tested by adding them to the OnLoad script in a Form. But they are most easily reused by uploading them in a static resource file.
Add a Button to Your Form
Given that you have a Help tab or a Help page somewhere, ready to display , the next step is to add a button to a form the user sees. This example puts the button in the record's details area. (That is the simplest form of the code.) It is also possible to display the button above the details area (just below the record banner).
- <syntaxhighlight lang="javascript" enclose="div">
var targetURL = "http://google.com"; // Put your page here var button =
'
<input type="button" value=" Help " onclick="...."> \
';
// Get the onclick code from the sections that follow
var action = _sdForm.get(0).a.value; // Determine the form type if (action == "add") {
// POPUP DIALOG. PUT HELP BUTTON IN THE NEW-RECORD FORM.
_sdForm.parent('div').parent('div').parent('div')
.find('.assigned_title .row-fluid').append(button);
} else {
// RECORD VIEW. PUT HELP BUTTON IN DETAILS AREA
_sdForm.parent('div').parent('div').prepend(button);
} </syntaxhighlight>
Go to the Help Tab
When the Help button is clicked, this code (in effect) reaches out an arm from behind the screen, grabs the mouse, and clicks on that tab!
- <syntaxhighlight lang="javascript" enclose="div">
function findByAttributeValue(attribute, value) {
var All = document.getElementsByTagName('*');
for (var i = 0; i < All.length; i++) {
if (All[i].getAttribute(attribute) == value) { return All[i]; }
}
}
function goToHelpTab() {
var helpTabLink = findByAttributeValue("display_title","HELP");
helpTabLink.click();
} </syntaxhighlight>
Then configure the form button to invoke the goToHelpTab() method:
- <syntaxhighlight lang="javascript" enclose="div">
var button =
'
<input type="button" value=" Help " onclick="goToHelpTab()"> \
';
</syntaxhighlight>
Note: When the Help tab is clicked (whether by the user or by code), an iFrame is then created to display the page content. It is theoretically possible to get the iFrame ID after that happens, and then chance the src attribute to display different content. But in practice it turns out to be difficult to do so reliably. In addition, the user would see a huge blink as page content changes. So this technique is limited to displaying a single, fixed page.
Open a JSP Page in a Separate Window
Opening a help page in a separate window has the advantage that the user can see the help page side-by-side with the application.
- <syntaxhighlight lang="javascript" enclose="div">
var button =
'
<input type="button" value=" Help "
onclick="window.open(\'/networking/page/PAGENAME.jsp\')"> \
';
</syntaxhighlight>