Monday, October 5, 2009

Using HTML and Javascript in SmartScripts

It is possible to enhance the SmartScript UI through the use of several HTML tags that can be defined in either the Questions or within the TemplateFile.
In order to enhance the font styles displayed within the QuestionText, you can define HTML tags within the Question text property in the Question Translation Applet. In the example displayed the tags can be used to display Text in Italic. Other HTML tags can be used to enhance this further, such as displaying text in bold, underlined etc.

It is also possible to display a hyperlink within the QuestionText property to link to a web page. This can be achieved through using the HTML tag. Note that the type specified for the question was Information, this is to enable the hyperlink on the URL to be displayed. If Information type is not used, then the QuestionText is displayed in BOLD and the hyper link is not displayed, although it is still possible to select the text and open the web page.

HTML tags can also be used to display graphics within the QuestionText property using the tag. The graphic is displayed in the text of the Question displayed when invoking the SmartScript.

You can also use javascript in a little different way.
In one of the requirement, we need to show a image besides the question.
As soon as user click the image we need to show the table specifying the details.
The below code give you an idea how we used that.
<img src="images/icon_req.gif" border="0" space="0" hspace="0">My Question<html>
<body>
<img src="images/hlp.gif" height = 20 width = 20 onclick="var p=window.createPopup();
var pbody=p.document.body;
pbody.style.border='solid black 1px';
pbody.innerHTML='<table border = 1><tr><td>Color</td><td>Text</td><td>Text</td></tr><tr><td bgcolor = Yellow>        </td><td><50%</td><td>Text</td></tr><tr><td bgcolor = Green>        </td><td>>=50%</td><td>>= 75%</td></tr><tr><td bgcolor = Yellow>        </td><td>>=50%</td><td>>=50% & <75%</td></tr><tr><td bgcolor = red>        </td><td>>=50%</td><td><50%</td></tr></table>';
p.show(450,250,200,200,document.body);">
</img>
</body>
</html>
The only limitation is that if the question is required then when it will pp up the nmessage for required question ,the siebel will show the javascript text as well.
To overcome this, we have to remove this question as required and at Question Leave event of the last question of this page or Question Enter event of the next page fist question, we can check the value if its null, we can RaiseErrorText inthe script that This question is required. Please give the answer.

Sharing is the Power

1 comment: