Table of contents
-
Web Application Modules (WAMs)
- Before You Begin
- 1. An Introduction to WAMs
-
2. WAMs Deconstructed
- 2.1 The Relationship Between WAMs, Webroutines, Weblet and Weblet Templates
- 2.2 Technology Services
- 2.3 Structure of a Webroutine's XSL
-
2.4 WAM Layouts and Layout Weblets
- 2.4.1 What is a WAM Layout?
- 2.4.2 What is a Layout Weblet?
- 2.4.3 What do Layouts Determine/Control?
- 2.4.4 How is a WAM layout assigned to a WAM?
- 2.4.5 How do I Create my Own Site Layout?
- 2.4.6 Can I Change the WAM Layout used by a Webroutine?
- 2.4.7 Can I Change the Layout Weblet associated with a WAM Layout?
- 2.5 Variables
- 2.6 Localized Variables
- 2.7 Cascading Style Sheets (CSS) and the Style Weblet
- 2.8 JavaScript and the Script Weblet
- 2.9 Messages
- 2.10 Types
- 2.11 Hidden
- 2.12 Keys
- 2.13 Inline Lists
-
3. Essential Topics
- 3.1 Using CHECKNUMERIC in WAMs
- 3.2 WAM Application Design
- 3.3 Developing for Multiple Languages
- 3.4 Using Cookies in Your WAM Application
- 3.5 Using the Service Name
- 3.6 Using Session Status
- 3.7 Deleting Objects
- 3.8 LOB Data Types and Stream Files
- 3.9 WAM External Resources
- 3.10 Using jQuery
- 3.11 Theming WAMs
- 3.12 Localization
- 3.13 JSON Support
- 3.14 Saving a WAM's Output to a File
- 3.15 Document Type Declaration (DOCTYPE)
- 4. Advanced Topics
- 5. Execute WAM Applications
- 6. WAM and WEBEVENT Interoperability
- 7. Technology Services
-
8. Weblets for XHTML Technology Service
-
8.1 Standard Weblets
-
8.1.1 Anchor (std_anchor)
- QuickStart - Anchor
-
Properties - Anchor
- name
- value
- currentrowhfield
- currentrownumval
- reentryfield
- reentryvalue
- hide_if
- formname
- url
- on_click_wamname
- on_click_wrname
- protocol
- show_in_new_window
- target_window_name
- pos_absolute_design
- width_design
- relative-image-path
- absolute-image-path
- class
- mouseover_class
- text_class
- presubmit_js
- tab_index
- vf_wamevent
-
8.1.2 Autocomplete (std_autocomplete)
- QuickStart Autocomplete
-
Properties Autocomplete
- name
- value
- display_mode
- maxlength
- size
- display_length
- keyboard_shift
- minLength
- delay
- sourceWamName
- sourceWrName
- termField
- listName
- labelField
- valueField
- extraFields
- cache
- matchContains
- hide_if
- class
- tab_index
- title
- read_only
- disabled
- pos_absolute
- width
- height
- scroll
- scrollHeight
- onchange_script
- onselect_script
- 8.1.3 Attachment panel (std_attach_panel_v2)
-
8.1.4 Push Button (std_button_v2) & Push Button with Images (std_image_button_v2)
- QuickStart- Push Button & Push Button with Images
-
Properties - Push Button & Push Button with Images
- name
- caption
- currentrowhfield
- currentrownumval
- left_relative_image_path
- left_absolute_image_path
- left_image_height
- right_relative_image_path
- right_absolute_image_path
- right_image_height
- submitExtraFields
- hide_if
- formname
- pos_absolute_design
- width_design
- height_design
- on_click_wamname
- on_click_wrname
- protocol
- show_in_new_window
- target_window_name
- disabled
- title
- text_class
- presubmit_js
- confirm
- confirmText
- tab_index
- default_button
- vf_wamevent
- 8.1.5 Checkbox (std_checkbox)
-
8.1.6 CKEditor Rich Text Editor (std_ckeditor)
- QuickStart CKEditor
-
Properties CKEditor Rich Text Editor
- name
- value
- valueFromField
- hide_if
- toolbar
- showSource
- showElementsPath
- toolbarCanCollapse
- pos_absolute
- width_design
- height_design
- resize_enabled
- resize_dir
- autoGrow
- autoGrow_maxHeight
- autoGrow_minHeight
- resize_maxHeight
- resize_maxWidth
- resize_minHeight
- resize_minWidth
- contentCss
- tab_index
- uiColor
- onchange_script
-
8.1.7 Clickable Image (std_click_image)
- QuickStart - Clickable Image
-
Properties - Clickable Image
- name
- value
- currentrowhfield
- currentrownumval
- reentryfield
- reentryvalue
- tooltip
- hide_if
- formname
- url
- on_click_wamname
- on_click_wrname
- protocol
- show_in_new_window
- target_window_name
- disabled
- hide_focus
- relative_image_path
- absolute_image_path
- mouseover_relative_image_path
- mouseover_absolute_image_path
- pos_absolute
- width_design
- height_design
- class
- disabled_class
- presubmit_js
- tab_index
- vf_wamevent
-
8.1.8 Combo Box (std_dropdown)
- QuickStart - Combo Box
-
Properties - Combo Box
- name
- value
- display_mode
- items
- listname
- selector_field
- selector_value_eq
- codefield
- captionfield
- tagfield1
- tagfield2
- tagfield3
- submit_tagfields
- reentryfield
- reentryvalue
- hide_if
- formname
- pos_absolute
- width_design
- on_change_wamname
- on_change_wrname
- protocol
- target_window_name
- disabled
- class
- mouseover_class
- tab_index
- vf_wamevent
-
8.1.9 Dynamic Select Box (std_dynamic_select)
- QuickStart - Dynamic Select Box
-
Properties - Dynamic Select Box
- name
- id
- value
- size
- display_mode
- hide_if
- items
- listname
- selectorField
- selectorValueField
- codeField
- captionField
- allowMultiSelect
- multiSelectListname
- multiSelectCodefield
- onChangeWamName
- onChangeWrName
- onChangeFormname
- onChangeExtraFields
- onChangeProtocol
- onChangeTarget
- position
- width
- disabled
- class
- tabIndex
- updateOnFieldChange
- updateWamName
- updateWrName
- updateFieldsToSubmit
- updateProtocol
- vf_wamevent
- 8.1.10 Export to Excel (std_toexcel)
- 8.1.11 File Upload (std_fileupload)
- 8.1.12 Grid (std_grid_v2 and std_grid_v3)
- 8.1.13 Image (std_image)
- 8.1.14 List Paging Images (std_list_images) and List Paging Buttons (std_list_buttons)
- 8.1.15 Mark-up (std_markup)
- 8.1.16 Memo using a list (std_list_textarea_v2)
- 8.1.17 Large List (std_largelist)
-
8.1.18 List Box (std_listbox)
- QuickStart - List Box
-
Properties - List Box
- name
- value
- display_mode
- items
- size
- allow_multi_selections
- multi_select_listname
- multi_select_codefield
- listname
- selector_field
- selector_value_eq
- codefield
- captionfield
- tagfield1, tagfield2, tagfield3
- submit_tagfields
- reentryfield
- reentryvalue
- hide_if
- formname
- pos_absolute
- height_design
- width_design
- on_select_wamname
- on_select_wrname
- protocol
- target_window_name
- disabled
- class
- mouseover_class
- tab_index
- vf_wamevent
- List Box Example
- 8.1.19 Menu bar (std_menubar)
- 8.1.20 Menu item (std_menu_item_v2)
-
8.1.21 Navigation Panel (std_nav_panel)
- QuickStart - Navigation Panel
-
Properties - Navigation Panel
- name
- border
- border_width
- hide_if
- pos_absolute
- width
- height
- size_panel_to_content
- size_panel_to_content_axis
- scrolling
- class
- transparent
- nav_url
- formname
- nav_wamname
- nav_wrname
- protocol
- nav_asynchronously
- reentryfield
- reentryvalue
- wait_content
- wait_content_timeout
- wait_content_class
- wait_content_relative_image
- wait_content_absolute_image
- wait_content_image_alignment
- wait_content_image_class
- vf_wamevent
- 8.1.22 Panel (std_ panel)
- 8.1.23 Print Page (std_printpage)
- 8.1.24 Progress bar (std_progressbar)
-
8.1.25 Prompter (std_prompter)
-
Properties - Prompter
- name
- caption
- relative_image_path
- absolute_image_path
- image_height
- image_width
- border
- border_width
- hide_if
- pos_absolute
- button_width
- button_height
- prompter_width
- prompter_height
- auto_resize
- button_class
- prompter_class
- button_mouseover_class
- formname
- prompter_url
- prompter_wamname
- prompter_wrname
- protocol
- field_name_to_exchange
- closing_url
- field_mapping
- closing_wrname
- reentryfield
- reentryvalue
- disabled
- title
- on_change_wamname
- on_change_wrname
- on_change_protocol
- on_change_reentryfield
- on_change_reentryvalue
- on_change_target_window_name
- pre_show_js
- tab_index
- vf_wamevent
-
Properties - Prompter
- 8.1.26 Radio Button (std_rad_button)
-
8.1.27 Radio Group (std_radbuttons)
- QuickStart - Radio Group
-
Properties - Radio Group
- name
- value
- display_mode
- items
- listname
- selector_field
- selector_value_eq
- codefield
- captionfield
- reentryfield
- reentryvalue
- hide_if
- formname
- on_click_wamname
- on_click_wrname
- protocol
- target_window_name
- alignment
- orientation
- show_groupbox
- group_title
- disabled
- pos_absolute
- width
- height
- class
- mouseover_class
- text_class
- groupbox_class
- tab_index
- vf_wamevent
- 8.1.28 Horizontal Splitter (std_splitter_horz)
- 8.1.29 Vertical Splitter (std_splitter_vert)
-
8.1.30 Tab Pages (std_tab_pages_v2)
- QuickStart - Tab pages
- Using the Tab Item Designer
- Using CSS with the Tab Pages weblet
-
Properties - Tab pages
- name
- tabs
- selected_tab_index
- selected_tab_index_field
- tab_alignment
- tab_image
- tab_selected_image
- tab_image_height
- tab_image_width
- tab_image_alignment
- listname
- caption_field
- image_field
- selected_image_field
- hide_if_true_field
- disable_if_true_field
- hide_if
- formname
- pos_absolute_design
- content_width
- content_height
-
8.1.31 Tree View (std_treeview_v2)
- QuickStart - Tree View
-
Properties - Tree View
- name
- listname
- listtype
- use_jQueryUI_theme
- jQueryUI_node_icon
- folder_closed_image
- folder_open_image
- item_image
- node_text_click
- key_fields
- display_fields
- list_caption_field
- list_image_field
- list_open_image_field
- list_id_field
- list_onselect_wamname_field
- list_onselect_wrname_field
- list_haschildren_field
- list_is_selected_field
- list_is_expanded_field
- list_parent_id_field
- onselect_wamname
- onselect_wrname
- onexpand_wamname
- onexpand_wrname
- onsubmit_id_field
- onsubmit_level_field
- onsubmit_ancestor_list
- target_window_name
- pos_absolute
- width
- height
- 8.1.32 Memo using a field (std_textarea)
-
8.1.1 Anchor (std_anchor)
-
8.2 Charting Weblets
- 8.2.1 Common Chart Topics
-
8.2.2 Google Bar Chart (std_gbar_chart)
- QuickStart Google Bar Chart
-
Properties Google Bar Chart
- name
- chartType
- listName
- transpose
- labels
- labelsColor
- labelsFontSize
- rangeLabels
- rangeLabelsColor
- rangeLabelsFontSize
- barWidth
- spaceBetweenBars
- spaceBetweenGroups
- seriesColor
- bgColor
- hide_if
- pos_absolute
- width
- height
- titleText
- titleColor
- titleFontSize
- axesColor
- margins
- legendText
- legendPos
- legendOrder
- legendColor
- legendFontSize
- legendMargins
-
8.2.3 Google Line Chart (std_gline_chart)
- QuickStart Google Line Chart
-
Properties Google Line Chart
- name
- chartType
- listName
- transpose
- labels
- labelsColor
- labelsFontSize
- rangeLabels
- rangeLabelsColor
- rangeLabelsFontSize
- seriesColor
- bgColor
- lineThickness
- markerType
- markerColor
- hide_if
- pos_absolute
- width
- height
- titleText
- titleColor
- titleFontSize
- axesColor
- margins
- legendText
- legendPos
- legendOrder
- legendColor
- legendFontSize
- legendMargins
- 8.2.4 Google Pie Chart (std_gpie_chart)
-
8.3 Standard Field Visualizations
- 8.3.1 Alphanumeric (std_char)
- 8.3.2 Boolean (std_boolean)
-
8.3.3 jQuery UI Datepicker (std_datepicker)
- QuickStart - Datepicker
-
Properties - Datepicker
- name
- value
- display_mode
- hide_if
- allow_sqlnull
- dateFormat
- firstDay
- changeMonth
- changeYear
- yearRange
- showOtherMonths
- selectOtherMonths
- minDate
- maxDate
- shortYearCuttoff
- showInline
- showOn
- showMonthAfterYear
- buttonImage
- tab_index
- title
- buttonText
- disabled
- pos_absolute
- width
- autoSize
- showAnim
- duration
- onchange_script
-
8.3.4 jQuery UI Datetimepicker (std_datetimepicker)
- QuickStart - Datetimepicker
-
Properties - Datetimepicker
- name
- value
- display_mode
- hide_if
- display_in_utc
- allow_sqlnull
- dateFormat
- timeFormat
- firstDay
- changeMonth
- changeYear
- yearRange
- showOtherMonths
- selectOtherMonths
- minDate
- maxDate
- stepHour
- stepMinute
- stepSecond
- shortYearCuttoff
- hourMin
- hourMax
- minuteMin
- minuteMax
- showOn
- showMonthAfterYear
- buttonImage
- tab_index
- title
- buttonText
- disabled
- pos_absolute
- width
- autoSize
- showAnim
- duration
- onchange_script
- 8.3.5 Float (std_float)
- 8.3.6 Input box (std_input)
- 8.3.7 Integer (std_integer)
-
8.3.8 Object (std_lob)
- QuickStart - Object
-
Properties - Object
- name
- value
- currentrowhfield
- currentrownumval
- reentryfield
- reentryvalue
- hide_if
- formname
- on_click_wamname
- on_click_wrname
- protocol
- show_in_new_window
- target_window_name
- pos_absolute_design
- width_design
- relative-image-path
- absolute-image-path
- class
- mouseover_class
- text_class
- presubmit_js
- tab_index
- vf_wamevent
- 8.3.9 jQuery UI Timepicker (std_timepicker)
- 8.3.10 Varchar (std_varchar)
- 8.4 Layout Weblets
-
8.1 Standard Weblets
-
9. Weblets for jQMobile Technology Service
- 9.1 jQMobile and the WAM Editor
- 9.2 Field Validation
- 9.3 Default Weblet
-
9.4 Standard Weblets
-
9.4.1 Anchor (std_anchor and std_anchor_s1)
-
Properties - Anchor (std_anchor and std_anchor_s1)
- absoluteImagePath (std_anchor_s1 only)
- id
- value
- class
- corners
- countIndicator (std_anchor_s1 only)]
- countValue (std_anchor_s1 only)
- customIcon (std_anchor_s1 only)
- displayAs
- hideIf
- icon
- iconPosition
- iconShadow
- inline
- mini
- onClickExtraFields
- onClickWamName
- onClickWrName
- relationship
- relativeImagePath (std_anchor_s1 only)
- shadow
- style
- swatch
- tabindex
- transition
- transitionDirection
- url
- useAjax
- internal_id
-
Properties - Anchor (std_anchor and std_anchor_s1)
- 9.4.2 Autocomplete (std_autocomplete)
- 9.4.3 Boolean (std_boolean)
-
9.4.4 Button (std_button_s1 and std_button_v2)
-
Properties - Button (std_button_s1 and std_button_v2)
- id
- name
- value
- autofocus
- caption
- class
- corners
- disabled
- form
- formaction
- formenctype
- formmethod
- formnovalidate
- formtarget
- hideIf
- icon
- iconPosition
- iconShadow
- inline
- mini
- onClickExtraFields
- onClickWamName
- onClickWrName
- presubmitJS
- shadow
- style
- swatch
- tabindex
- title
- transition
- transitionDirection
- type
- useAjax
- internal_id
-
Properties - Button (std_button_s1 and std_button_v2)
- 9.4.5 Checkbox (std_checkbox)
- 9.4.6 Collapsible Block (std_collapsible)
- 9.4.7 Collapsible Set (std_collapsibleset)
- 9.4.8 Control Group (std_controlgroup)
-
9.4.9 Select Menu (std_dropdown)
-
Properties - Select Menu (std_dropdown)
- name
- id
- value
- addErrorDiv
- autofocus
- class
- corners
- disabled
- displayMode
- fieldContainWrapper
- form
- hideIf
- hideLabel
- icon
- iconPosition
- iconShadow
- items
- inline
- label
- mini
- multiple
- multiSelectCodeField
- multiSelectListname
- overlaySwatch
- placeholder
- rdmlxDataType
- required
- selectorValueField
- shadow
- style
- swatch
- tabindex
- title
- updateFieldsToSubmit
- updateOnFieldChange
- updateProtocol
- updateWamName
- updateWrName
- useNativeControl
-
Properties - Select Menu (std_dropdown)
- 9.4.10 File Upload (std_fileupload)
- 9.4.11 Footer (std_footer)
- 9.4.12 Layout Grid (std_gridlayout)
- 9.4.13 Header (std_header)
- 9.4.14 HTML List (std_html_list)
- 9.4.15 HTML List Item (std_html_li)
- 9.4.16 Image (std_image)
- 9.4.17 Loader (std_loader)
-
9.4.18 Input Box (std_input)
-
Properties - Input Box (std_input)
- id
- name
- value
- accept
- addErrorDiv
- alt
- autocomplete
- autofocus
- class
- corners
- disabled
- displayMode
- fieldContainWrapper
- form
- formaction
- formenctype
- formmethod
- formnovalidate
- formtarget
- height
- hideIf
- hideLabel
- label
- list
- max
- maxlength
- min
- mini
- multiple
- pattern
- placeholder
- rdmlxDataType
- readonly
- required
- size
- src
- step
- style
- swatch
- tabindex
- title
- type
- clearButton
- clearButtonText
- width
-
Properties - Input Box (std_input)
- 9.4.19 Messages (std_messages)
- 9.4.20 Mobiscroll Date and Time Picker (std_mobiscroll)
- 9.4.21 Navigation Bar (std_navbar)
- 9.4.22 Progress bar (std_progressbar)
- 9.4.23 Radio Button Group (std_radbuttons)
- 9.4.24 RDMLX Working List (std_repeater)
- 9.4.25 HTML Textarea (std_textarea)
-
9.4.1 Anchor (std_anchor and std_anchor_s1)
-
9.5 Layout Weblets
- 9.5.1 Basic Layout (std_layout_v2)
-
9.5.2 Flexible Layout (std_flex_layout)
-
Properties - Flexible Layout (std_flex_layout)
- addBackButton
- backButtonSwatch
- backButtonText
- contentSwatch (deprecated)
- footerFullscreenMode
- footerPosition
- footerSwatch
- headerFullscreenMode
- headerPosition
- headerSwatch
- pageSwatch
- persistentFooterId
- showFooter
- showHeader
- showMessages
- sidebarPositionSmallScreen
- validationErrorDisplay
- validationTime
- windowTitle
-
Properties - Flexible Layout (std_flex_layout)
- 9.6 Utility Weblets
-
WAM Tutorials
- Before You Begin
- What is a WAM?
- WAM005 - Create Your First WAM
-
WAM010 - Using WEB_MAPs
- Step 1. Create a new WAM
- Step 2. Add WebRoutines to the new WAM
- Step 3. Compile the WAM and Open for Editing
- Step 4. Add buttons to the WebRoutine
- Step 5. Understand the Web Routine
- Step 6. Change the Employee Number field
- Step 7. Add the RDMLX for the second WebRoutine
- Step 8. Add buttons to the WebRoutines
- Step 9. Understand WEB_MAP
- Summary
- WAM015 - Working Lists
- WAM020 - WAM Navigation
- WAM025 - Using the Layout Wizard
- WAM030 - Employee Enquiry
- WAM035 - An Employee Update WAM
- WAM040 - Add dropdown lists for Department and Section
- WAM045 - A Dynamic Selector Dropdown list using a Select Field
- WAM050 - A Section Maintenance Application
- WAM055 - Using LANSA Debug
-
WAM060 - Employee Maintenance using Advanced Weblets
- Step 1. Create WAM iiiEmpMaint Employee Maintenance
- Step 2. Set up the ShowPage web page design
- Step 3. Complete the ShowPage web page design
- Step 4. Define the Details WebRoutine
- Step 5. Extend the Details WebRoutine for update
- Step 6. Extend the Details WebRoutine to add new employee skill
- Step 7. Control which Tab is redisplayed
- Step 8. Replace Date Acquired with a Date field (Optional).
- Step 9. Change Grade to a Dropdown list (Optional)
- Summary
- WAM065 - Controlling List Output
- WAM070 - Hiding Techniques
- WAM075 - Using a Tree View Weblet
- WAM080 - Session Management
-
WAM085 - Enhancing the User Interface
- Step 1. Create Repository Field Definitions
- Step 2. Create Employee Number AutoComplete WAM
- Step 3. Create WAM iiiEnhancedUI Enhancing the Interface
- Step 4. Define Work Fields and Lists
- Step 5. Complete WAM RDMLX
- Step 6. Design the web pages
- Step 7. Test the WAM
- Step 8. Improve the ShowPage Page Design
- Step 9. Insert a fieldset around each table
- Summary
- WAM090 - Using a List Row Weblet
-
WAM095 - LOB Data Types and Stream Files
- Step 1. Install Required Documents
- Step 2. Set up Documents for an Employee
- Step 3. Create WAM to Display Employee Documents
- Step 3a. Create WAM to Display Employee Documents
- Step 4. Enhance Appearance of the Documents List (Optional)
- Step 5. Set up the Documents List
- Step 5a. Set up the Documents List
- Step 6. Test your Enhanced WAM
- Summary
- WAM095. Appendix A
- WAM095. Appendix B
- WAM095. Appendix C
-
WAM100 - Using Cascading Style Sheets
- Step 1. Create WAM iii Using CSS
- Step 2. Create new Style Sheet
- Step 3. Create an External Resource
- Step 4. Apply Style Sheet to WAM iiiUsingCSS
- Step 5. Apply External Resource to the Common Layout
- Step 6. Make the Style Sheet specific to lists named EMPLIST
- Step 7. Highlight a Column
- Summary
- WAM100. Appendix
- WAM105 - Create Your Own Weblet
- WAM110 - Create Your Own Layout Weblet
- WAM115 - Check in WAMs to IBM i
- WAM120 - Using the Menu Bar Weblet
- WAM125 - Define a Dynamic Menu
- WAM130 - Output a Web Page to a File
- WAM135 - Using the Google Static Maps API
- Appendix A. XSL and XML Conformance
- Appendix B. WAM XML Structure
-
Appendix C. Deprecated Weblets
- Attachment panel (std_attachment_panel)
- Dynamic HTML menu bar (std_dhtml_menu)
-
Push Button (std_button) & Push Button with Images (std_image_button)
- QuickStart- Push Button & Push Button with Images
-
Properties - Push Button & Push Button with Images
- name
- caption
- currentrowhfield
- currentrownumval
- left_relative_image_path
- left_absolute_image_path
- left_image_height
- right_relative_image_path
- right_absolute_image_path
- right_image_height
- reentryfield
- reentryvalue
- hide_if
- formname
- pos_absolute_design
- width_design
- height_design
- on_click_wamname
- on_click_wrname
- protocol
- show_in_new_window
- target_window_name
- disabled
- text_class
- title
- class
- mouseover_class
- left_image_class
- right_image_class
- presubmit_js
- tab_index
- default_button
-
Tree View (std_treeview)
- QuickStart - Tree View
-
Properties - Tree View
- name
- formname
- xmlid
- xmltyped
- folder_closed_image
- folder_open_image
- item_image
- listname
- list_caption_field
- list_type_field
- list_image_field
- list_open_image_field
- list_tag_field
- list_onselect_wrname_field
- list_haschildren_field
- list_subitem_group_field
- list_is_selected_field
- list_is_expanded_field
- list_parent_id_field
- list_style_field
- list_selected_style_field
- onexpand_wamname
- onexpand_wrname
- listname_of_parents_of_selected
- pos_absolute_design
- width_design
- height_design
- class
- bg_color
- default_style
- selected_style
- An In-Depth Look at the Tree View Weblet
- Tree View Target (std_treeview_target)
- Date (std_date)
- DateTime (std_datetime)
- Time (std_time)