Extending : Widget extension : Widget extension samples : ToggleButton widget sample
  
ToggleButton widget sample
The ToggleButton widget is a very simple widget. onText is displayed on the button by default. When it is clicked, offText is displayed on the button. Meanwhile, the onClick event is added to the widget so that when the button is clicked, the onClick event is triggered.
Although the ToggleButton widget it is a simple example, more complex widget extension tasks are also covered in the example to enable technical developers who have an overall understanding of UDTT extend widgets quickly. Listed below are tasks that are covered in this sample:
Creating a new widget definition .xml file for the widget.
Registering a widget extension point in the plugin.xml file.
Creating widget mapping file.
Adding widget mapping extension point in the plugin.xml file.
Implement jsp handler class for the widget.
Implement JavaScript code for the widget.
Modify template.jsp to add required js implementation for the widget.
Create alphadojo.tld to add extended jsp tags for the widget.
The implementation items of this sample are in two projects:
AlphaSampleWidegt.zip
AlphaTest.zip
Implementation items included in the ToggleButton sample.
ToggleButton.xml
Widget Definition file
Location: Widget folder in AlphaSampleWidget project
See also: Defining a widget
ToggleButton.PNG
Icon used to show ToggleButton in XUI Editor Palette
Location: Icon folder in AlphaSampleWidget project
See also: Importing a widget
ToggleButton widget extension point
Extension point registration of ToggleButton widget
Location: Extensions tab of plugin.xml in the AlphaSampleWidget project
See also: Importing a widget
alphaMapping.xml
Define widget mapping in the file
Location: Configure folder in AlphaSampleWidget project
See also: Creating and registering widget mappings
DojoToggleButtonTag.java
JSP tag handler implementation for the widget
Location: src/com/ibm/btt/alphatest/dojo/tag folder in AlphaTest project
See also: Implementing and registering a JSP tag handler
New tag element section in alphadojo.tld
JSP tag handler registration
Location: WebContent/WEB-INF folder in the AlphaTest project
See also: Implementing and registering a JSP tag handler
ToggleButton.js
JavaScript implementation for the widget
Location: WebContent/js/com/ibm/btt/dijit folder in the AlphaTest project
See also: Dijit implementation
Go up to
Widget extension samples