The widgets are enriched form fields.
All types have a default widget that is simple.
E.g. a text field for a string.
Sometimes, you use a string to store something hard to enter (a page reference for exemple) so you want to use an apropriate widget. You can use one of the followings or create your own.
Note, that some plugins bring their own widgets that are not listed here. e.g. The newsletter plugin provides a widget to select a category of newsletter.
Widget id | textarea |
JS class | org.ametys.widgets.TextareaWidget |
Type | STRING |
Use this widget to enter a string in a textarea
Widget id | small-richtext |
JS class | org.ametys.widgets.SmallRichText |
Type | RICH-TEXT |
Use this widget when you want a rich text smaller (in height) than the default one
Widget id | html-richtext |
JS class | org.ametys.widgets.AllTagsRichText |
Type | RICH-TEXT |
Use this widget when you want a rich text editor that does not valid the html inside.
The default widget does send only validated tags and attributes (depending on the plugins)n this one will send everything.
For exemple, if a copy-paste insert this in the rich-text
<p class="unknownclass"><unknowntag/></p>
The default widget will send this
<p></p>
Whereas the html rich text will end it as it is.
This widget is so dangerous, and might only be used when the content storage is directly HTML.
It should not be used on docbook contents.
Widget id | multiselect |
JS class | org.ametys.widgets.MultiSelectWidget |
Type | STRING |
Use this widget to allow multiselection. The availables values will be display in a combo box with multi-selection
Widget id | sitemap |
JS class | org.ametys.cms.widgets.SitemapWidget |
Type | STRING |
This widget allows to choose one or several pages in sitemap by choosing the site and language (in combo boxes).
The field value is the id(s) of selected page(s).
Configuration options:
Widget id | current-sitemap |
JS class | org.ametys.cms.widgets.CurrentSitemapWidget |
Type | STRING |
This widget is an implementation of the Sitemap widget, restricted to the current site.
The field value is the id(s) of selected tag(s).
Configuration options:
Widget id | tags |
JS class | org.ametys.web.widget.TagsWidget |
Type | STRING |
This widget allows to choose content or page tags
Configuration options:
Widget id | content-tags |
JS class | org.ametys.web.widget.ContentTagsWidget |
Type | STRING |
This widget is an implementation of the Tags widget, restricted to content tags.
Configuration options:
Widget id | page-tags |
JS class | org.ametys.web.widget.ContentTagsWidget |
Type | STRING |
This widget is an implementation of the Tags widget, restricted to page tags.
Configuration options:
Widget id | tag-categories |
JS class | org.ametys.web.widget.TagCategoriesWidget t |
Type | STRING |
This widget allows the user to select a category of tag.
Widget id | user |
JS class | org.ametys.cms.widgets.UserSelectorWidget |
Type | USER |
This widget allows to choose one or more users (among the users handled by the user manager)
The field value is the login(s) of selected user(s).
Widget id | external-file |
JS class | org.ametys.cms.widgets.ExternalFilesWidget |
Type | BINARY |
This widget allows the user to upload a file from his hard drive
The widget displays the name, the length and the thumbnail of the file and allows to download the uploaded file.
Widget id | external-image |
JS class | org.ametys.cms.widgets.ExternalFilesWidget |
Type | BINARY |
This widget allows the user to upload an image (.png, .jpg, .jpep, .gif) from his hard drive. The file extension is checked.
The widget displays the name, the length and the thumbnail of the image and allows to download the uploaded image.
Widget id | external-multimedia |
JS class | org.ametys.cms.widgets.ExternalMultimediaWidget |
Type | BINARY |
This widget allows the user to upload a media file(.swf, .flv, .mp3) from his hard drive. The file extension is checked.
The widget displays the name, the length and the thumbnail of the media and allows to download the uploaded media file.
Widget id | external-or-resource-file |
JS class | org.ametys.web.widgets.ExternalOrResourceFilesWidget |
Type | FILE |
This widget allows the user to upload a file from his hard drive or to select a file in resource explorer.
The widget displays the name, the length and the thumbnail of the file and allows to download it.
Widget id | external-or-resource-image |
JS class | org.ametys.web.widgets.ExternalOrResourceImagesWidget |
Type | FILE |
This widget allows the user to upload an image (.png, .jpg, .jpep, .gif) from his hard drive or to select an image in resource explorer.
The widget displays the name, the length and the thumbnail of the image and allows to download it.
Widget id | external-or-resource-multimedia |
JS class | org.ametys.web.widgets.ExternalOrResourceMultimediaWidget |
Type | FILE |
This widget allows the user to upload a media file (.swf, .flv, .mp3) from his hard drive or to select a media file in resource explorer.
The widget displays the name, the length and the thumbnail of the file and allows to download it.
Widget id | pick-content |
JS class | org.ametys.cms.widgets.SelectContentWidget t |
Type | STRING |
This widget allows the user to select a content attached to a page.
Sample of metadata declaration using the external or resourec image widget
<cms:metadata name="image" type="file"> <label i18n="true">CONTENT_ARTICLE_IMAGE</label> <description i18n="true">CONTENT_ARTICLE_IMAGE_DESC</description> <widget>external-or-resource-image</widget> </cms:metadata>
Sample of service parameter using the current sitemap widget (with multiple selection)
<parameter name="pages" type="string" multiple="true"> <label i18n="true">PLUGINS_WEB_SERVICE_FRONT_SEARCH_BY_SECTION</label> <description i18n="true">PLUGINS_WEB_SERVICE_FRONT_SEARCH_BY_SECTION_DESC</description> <widget>current-sitemap</widget> </parameter>
A widget is an element of a form. You must write your own JS object which necessary extends a form field (TextField, NumberField, ComboBox, ...).
org.ametys.myplugin.widgets.MyWidget = function(config) { org.ametys.myplugin.widgets.MyWidget.superclass.constructor.call(this, config); }; Ext.extend(org.ametys.myplugin.widgets.MyWidget, Ext.form.TextField, { // The configuration options of the widget buttonIcon : getPluginResourceUrl('myplugin') + '/img/widget/btn.png', multiple: false, // etc, ... } org.ametys.myplugin.widgets.MyWidget.prototype.onRender = function(ct, position) { org.ametys.myplugin.widgets.MyWidget.superclass.onRender.call(this, ct, position); // Override the onRender function to give the widget its own look (add a button, an image, a hidden field, ...) } org.ametys.cms.widgets.SitemapWidget.prototype.setValue = function (values) { // Override the setValue function if necessary }
To be used, a widget must be registered as an available widget for a given type as following
org.ametys.utils.Widgets.registerWidget (type, widgetId, jsClass');
Samples :
org.ametys.utils.Widgets.registerWidget ('binary', 'external-image', 'org.ametys.cms.widgets.ExternalImagesWidget'); org.ametys.utils.Widgets.registerWidget ('string', 'sitemap', 'org.ametys.cms.widgets.SitemapWidget'); org.ametys.utils.Widgets.registerWidget ('string', 'my-widget', 'org.ametys.myplugin.widgets.MyWidget');