DEPRECATION WARNING
This documentation is not using the current rendering mechanism and is probably outdated. The extension maintainer should switch to the new system. Details on how to use the rendering mechanism can be found here.
EXT: Form Widgets¶
| Author: | Kasper Skårhøj |
|---|---|
| Created: | 2002-11-01T00:32:00 |
| Changed: | 2006-01-16T19:57:12 |
| Author: | Peter Klein |
| Email: | peter@umloud.dk |
| Info 3: | |
| Info 4: |
EXT: Form Widgets¶
Extension Key: formwidgets
Copyright 2005-2006, Peter Klein, <peter@umloud.dk>
This document is published under the Open Content License
available from http://www.opencontent.org/opl.shtml
The content of this document is related to TYPO3
- a GNU/GPL CMS/Framework available from www.typo3.com
Table of Contents¶
EXT: Form Widgets 1
Introduction 1
What does it do? 1
Screenshots 1
Users manual 1
Adminstration 1
Configuration 2
Reference 2
Known problems 3
To-Do list 3
Changelog 3
Introduction¶
What does it do?¶
- This extension uses an unobtrusive DHTML techique (a javascript behaviour/presentation layer) that converts standard checkboxes & radiobuttons to a working graphical equivalent.
- The extension works independantly of whether Javascript or CSS is enabled (it degrades correctly). This means that if the user's browser doesn't have Javascript enabled, they won't loose any functionality.
Users manual¶
- Nothing special to do, just install the extension and watch how your checkboxes and radiobuttons now look. :)
Adminstration¶
- The plugin is copied into page.1010 of your template like this:
page.1010 < plugin.tx_formwidgets_pi1
- So if you use that pagenumber for something else, you need to change it.
Configuration¶
This plugin only use ONE image for clicked/unclicked and rollover/focus. All swapping of images are done by changing background position.
¶
Checkbox image
Disabled checkbox image
Radiobutton image
Disabled Radiobutton image
- A couple of different replacement sets can be found in the GFX folder inside the extension.
The major part of configuring this plugin, is done via CSS. Simply change the 'background: url()' property to point to your images.
((generated))¶
((generated))¶
Example¶
plugin.tx_formwidgets_pi1 {
_CSS_DEFAULT_STYLE (.tx-formwidgets-radio1,.tx-formwidgets-radio2 ,.tx-formwidgets-radio3,.tx-formwidgets-radio4 {background : url(typo3conf/ext/formwidgets/gfx/h2ogtk2_radio.gif) no- repeat;cursor: hand;cursor: pointer;margin : 0px 2px 0px 2px;}
.tx-formwidgets-checkbox1,.tx-formwidgets-checkbox2,.tx-formwidgets- checkbox3,.tx-formwidgets-checkbox4 {background : url(typo3conf/ext/formwidgets/gfx/h2ogtk2_checkbox.gif) no- repeat;cursor: hand;cursor: pointer;margin : 0px 2px 0px 2px;}
.tx-formwidgets-radiodisabled {background : url(typo3conf/ext/formwidgets/gfx/h2ogtk2_radio_disabled.gif) no- repeat;cursor: default;}
.tx-formwidgets-checkboxdisabled {background : url(typo3conf/ext/formwidgets/gfx/h2ogtk2_checkbox_disabled.gif) no- repeat;cursor: default;}
.tx-formwidgets-radio1,.tx-formwidgets-checkbox1 {background-position : top left;}.tx-formwidgets-radio2,.tx-formwidgets-checkbox2 {background-position : top right;}.tx-formwidgets-radio3,.tx- formwidgets-checkbox3 {background-position : bottom left;}.tx- formwidgets-radio4,.tx-formwidgets-checkbox4 {background-position : bottom right;})}
Reference¶
enableFocus¶
Property
enableFocus
Data type
boolean
Description
Should focus/blur be enabled for the widgets?
Default
1
enableMouseover¶
Property
enableMouseover
Data type
boolean
Description
Should mouseover/mouseout be enabled for the widgets?
Default
1
checkboxWidth¶
Property
checkboxWidth
Data type
int
Description
Width of checkbox image replacement.
Default
13
checkboxHeight¶
Property
checkboxHeight
Data type
int
Description
Height of checkbox image replacement.
Default
13
radioWidth¶
Property
radioWidth
Data type
int
Description
Width of radiobutton image replacement.
Default
13
radioHeight¶
Property
radioHeight
Data type
int
Description
Height of radiobutton image replacement.
Default
13
[tsref:(cObject).formwidget]
Known problems¶
- If the page contains more than one form, then problems can occur if both forms have fields with the same name.
- Radiobutton and checkboxes doesn't get updated if their state is changed by javascript. Unfortunatly it's not possible to fix this bug, as radiobuttons and checkboxes doesn't support the “onChange” event. :(
To-Do list¶
Maybe fix the problem with identical formfield names.
Changelog¶
- 0.0.1: First version.
- 0.0.2-0.0.6: Problems with uploading the manual.
- 0.0.7: Changed the way the replacements was done. Before it replaced images when clicked. This version only use ONE image for clicked/unclicked and rollover/focus. All swapping of images are done by changing background position.Added keyboard support.Added function to check if images are enabled in the browser.
- 1.0.0: Changed the onLoad handler, so it now works with TMENU_LAYERS/GMENU_LAYERS and other extensions that uses the onLoad handler.
EXT: Form Widgets - 3