A data type extension sample is provided to demonstrate how to implement a data type extension in the UNICOM® Digital Transformation Toolkit (UDTT™) framework. In the sample, we will implement a simple ‘TimeZone' data type to demonstrate all the tasks that are required to extend a data type.
TimeZone is a common data type in business. In this sample, TimeZone type is required in the format of GMT+(-)DD where DD is two digits that range from 0 to 12. The TimeZone type can have two validation parameter, minoffset and maxoffset, which limit the range of valid TimeZone data.
To implement the TimeZone type
1 Define the data type by adding the following lines to the type.xml file:
2 Implement TimeZoneValidator for the TimeZone type.
▪ Create a new class, com.ibm.btt.alphatest.types.impl.TimeZoneValidator, which extends com.ibm.btt.base.types.impl.BaseValidator, and override the validate method
▪ The TimeZone type has two validation parameters, maxoffset and minoffset. Implement a class, TimeZoneValidationParamBean, which extends BaseValidator.ValidationParamBean in TimeZoneValidator.
public static class TimeZoneValidationParamBean extends BaseValidator.ValidationParamBean{ //in format: GMT Sign TwoDigitHours : Minutes public String maxoffset; public String minoffset; }
3 Implement TimeZoneConverter for TimeZone by creating a new class, com.ibm.btt.alphatest.types.impl.TimeZoneConverter, which extends com.ibm.btt.base.types.impl.BaseConverter. TimeZoneConverter must override the format and the unformat methods.
4 Implement a presentation widget for Timezone, and name the widget as TimeZoneTextBox.
The TimeZoneTextBox widget is used to validate whether the input text conforms to the format of TimeZone. This must be implemented in the validator: function(/*anything*/value, /*dijit.form.ValidationTextBox.__Constraints*/constraints) method.
After implementing the widget for the TimeZone type, ensure that the TimeZoneTextBox can be generated as an input text box for the TimeZone type data when UDTT generates HTML from JSP. By default, UDTT runtime generates a JSP file to an HTML file. UDTT uses com.ibm.btt.dojo.tag.DojoTextBoxTag to generate the tag for the input data. DojoTextBoxTag can handle only original UDTT data types such as String, Number, and Currency. Because DojoTextBoxTag cannot generate a tag for a new data type, you must extend DojoTextBoxTag. Name the new class as com.ibm.btt.alphatest.dojo.tag.AlphaTextBoxTag. You must also override the getWidgetType method to generate a new widget tag for the TimeZone data type.
Update the bttdojo.tld file to replace DojoTextBoxTag with AlphaTextBoxTag. To replace DojoTextBoxTag with AlphaTextBoxTag, open bttdojo.tld, and replace the following lines:
▪ Copy types.xml and bttdojo.xml from the AlphaWidget project to the same place in the AlphaTest_v8.0 project; and then copy alphatype.jar into the “WebContent->WEB-INF->lib” folder of the AlphaTest_v8.0 project.
6 Create a test operation.
▪ Create a new operation definition file named datatypeExtensionOp.xml.
▪ In datatypeExtensionOp.xml, define an operation named datatypeExtensionOp. The implclass of this operation is com.ibm.btt.sample.operation.DataTypeExtensionOperation. Define a context named dataTypeExtensionCtx for the operation. In this context, define two ‘TimeZone' type data named ‘preferTimeZone' and ‘timezone', and define a data list named timeZoneList. The definition of the datatypeExtensionOp operation is shown as below:
<datatypeExtensionOp.xml> <!-- This operation gets from the context a field containing the page wanted to be shown to the user and places it in the right place to make Composer understand that this page must be shown. --> <!-- Operation definition --> <operation context="dataTypeExtensionCtx" id="datatypeExtensionOp" implClass="com.ibm.btt.sample.operation.DataTypeExtensionOperation"> </operation>
▪ Implement the com.ibm.btt.sample.operation.DataTypeExtensionOperation class.
▪ Because this is a simple sample, the com.ibm.btt.sample.operation.DataTypeExtensionOperation class simply extends BTTServerOperation and overrides the execute method with the following lines. No business logic needs to be implemented.
▪ Right-click the xui folder, and then click New > Other > New XUI File.
▪ In the File name field of the Create XUI File window, enter datatypeExtension.xui. Click Finish.
▪ Open datatypeExentsion.xui in the XUI editor, and then click the grey area to open the Properties tab.
▪ In the Properties tab, click Select Context.
▪ In the Please select a context window, click datatypeExtensionOp.xml > dataTypeExtensionCtx. Click OK.
▪ In the XUI editor, create a page as shown below:
▪ Click the Text Widget. In the Properties tab of the Text widget, edit the dataName property by selecting datatypeExtension > dataTypeExtensionCtx > preferTimeZone.
▪ Click the Combo widget. In the Properties tab, edit the dataName property by selecting datatypeExtension > dataTypeExtensionCtx > timezone; and then for the dataNameForList property select datatypeExtension > dataTypeExtensionCtx > timezoneList.
▪ Save the file.
▪ Right-click the datatypeExentsion.xui file, and then click Generate dojo to generate JSP.
▪ Open the index.xui file in the XUI editor, and then add a Link widget.
▪ In the Properties tab of the Link widget, select the Action tab. Select Launch Operation for Action Type, and then select datatypeExtensionOp for operationId.
▪ Save the file.
▪ Right-click the index.xui file, and then select Generate dojo to generate JSP.
▪ Copy TimeZoneTextBox.js from the AlphaWidget project to the AlphaTest_v8.0 project.
▪ Deploy the test application to WebSphere® Application Server and run.
Result: When you open the datatypeExtension.jsp page, it is displayed as shown in the datatypeExtension.jsp page.
The datatypeExtension.jsp page
As shown in the datatypeExtension.jsp page, the text box validates whether the user input String is in the format GMT+(-)DD. Also, as shown in the text box validates whether the value is in within the specified range, the text box validates whether the value is within the specified range, for example from GMT+6 to GMT+8.
The text box validates whether the value is in within the specified range
