2241a8816331bad546a8dc012502f8970a3a2af5
[Packages/TYPO3.CMS.git] / typo3 / sysext / form / Resources / Public / JavaScript / Wizard / Elements / Basic / Select.js
1 Ext.namespace('TYPO3.Form.Wizard.Elements.Basic');
2
3 /**
4 * The SELECT element
5 *
6 * @class TYPO3.Form.Wizard.Elements.Basic.Select
7 * @extends TYPO3.Form.Wizard.Elements
8 */
9 TYPO3.Form.Wizard.Elements.Basic.Select = Ext.extend(TYPO3.Form.Wizard.Elements, {
10 /**
11 * @cfg {String} elementClass
12 * An extra CSS class that will be added to this component's Element
13 */
14 elementClass: 'select',
15
16 /**
17 * @cfg {Mixed} tpl
18 * An Ext.Template, Ext.XTemplate or an array of strings to form an
19 * Ext.XTemplate. Used in conjunction with the data and tplWriteMode
20 * configurations.
21 */
22 tpl: new Ext.XTemplate(
23 '<div class="overflow-hidden">',
24 '<tpl for="label">',
25 '<tpl if="value && parent.layout == \'front\'">',
26 '<label for="">{value}{[this.getMessage(parent.validation)]}</label>',
27 '</tpl>',
28 '</tpl>',
29 '<select {[this.getAttributes(values.attributes)]}>',
30 '<tpl for="options">',
31 '<option {[this.getAttributes(values.attributes)]}>{data}</option>',
32 '</tpl>',
33 '</select>',
34 '<tpl for="label">',
35 '<tpl if="value && parent.layout == \'back\'">',
36 '<label for="">{value}{[this.getMessage(parent.validation)]}</label>',
37 '</tpl>',
38 '</tpl>',
39 '</div>',
40 {
41 compiled: true,
42 getMessage: function(rules) {
43 var messageHtml = '';
44 var messages = [];
45 Ext.iterate(rules, function(rule, configuration) {
46 if (configuration.showMessage) {
47 messages.push(configuration.message);
48 }
49 }, this);
50
51 messageHtml = ' <em>' + messages.join(', ') + '</em>';
52 return messageHtml;
53
54 },
55 getAttributes: function(attributes) {
56 var attributesHtml = '';
57 Ext.iterate(attributes, function(key, value) {
58 if (value) {
59 attributesHtml += key + '="' + value + '" ';
60 }
61 }, this);
62 return attributesHtml;
63 }
64 }
65 ),
66
67 /**
68 * Constructor
69 *
70 * Add the configuration object to this component
71 * @param config
72 */
73 constructor: function(config) {
74 Ext.apply(this, {
75 configuration: {
76 attributes: {
77 "class": '',
78 disabled: '',
79 id: '',
80 lang: '',
81 multiple: '',
82 name: '',
83 size: '',
84 style: '',
85 tabindex: '',
86 title: ''
87 },
88 filters: {},
89 label: {
90 value: TYPO3.l10n.localize('elements_label')
91 },
92 options: [
93 {
94 data: TYPO3.l10n.localize('elements_option_1'),
95 value: TYPO3.l10n.localize('elements_value_1')
96 }, {
97 data: TYPO3.l10n.localize('elements_option_2'),
98 value: TYPO3.l10n.localize('elements_value_2')
99 }, {
100 data: TYPO3.l10n.localize('elements_option_3'),
101 value: TYPO3.l10n.localize('elements_value_3')
102 }
103 ],
104 layout: 'front',
105 validation: {}
106 }
107 });
108 TYPO3.Form.Wizard.Elements.Basic.Select.superclass.constructor.apply(this, arguments);
109 }
110 });
111
112 Ext.reg('typo3-form-wizard-elements-basic-select', TYPO3.Form.Wizard.Elements.Basic.Select);