Feature #70332
Updated by Ralf Zimmermann over 8 years ago
The Ext:form frontend was rewritten, thats cool.
Now the wizard should support some more attributes. At the moment the wizard is able to set some attributes, but this attribute-set is not complete and don't include html5 attributes.
This patch let the wizard set all universal html attributes + html5 attributes
based on selfhtml documentation version 8.1.2.
What to test:
* the wizard must display all attributes for the element
* the wizard must write all attributes for the element
* the wizard must set all attributes for the element at reopen the wizard
* the fronted must add the attributes to the element tag
At the moment the feature rst is missing. We write it asap.
All Elements support the universal attributes:
<pre>accesskey, class, contenteditable, contextmenu, dir, draggable, dropzone, hidden, id, lang, spellcheck, style, tabindex, title, translate</pre>
Custom element attributes:
* Input
** <pre>accept, autocomplete, autofocus, checked, disabled, inputmode, list, max, maxlength, min, minlength, multiple, name, pattern, placeholder, readonly, required, size, step, type, value</pre>
* Form
** <pre>accept, acceptcharset, action, autocomplete, enctype, method, name, novalidate</pre>
* Button
** <pre>autofocus, disabled, name, type, value</pre>
* Select
** <pre>autofocus, disabled, multiple, name, required, size</pre>
* Textarea
** <pre>autofocus, cols, disabled, inputmode, maxlength, minlength, name, placeholder, readonly, required, rows, selectionDirection, selectionEnd, selectionStart, wrap</pre>
* Submit
** <pre>autofocus, disabled, name, type, value</pre>
* Radio
** <pre>autofocus, checked, disabled, name, readonly, required, type, value</pre>
* Password
** <pre>autocomplete, autofocus, disabled, maxlength, minlength, name, pattern, placeholder, readonly, required, size, type, value</pre>
* Hidden
** <pre>name, type, value</pre>
* Fileupload
** <pre>accept, autofocus, disabled, multiple name, readonly, required, type, value</pre>
* Reset
** <pre>autofocus, disabled, name, type, value</pre>
* Textline
** <pre>autocomplete, autofocus, disabled, inputmode, list, maxlength, minlength, name, pattern, placeholder, readonly, required, size, type, value</pre>
* Checkbox
** <pre>autofocus, checked, disabled, name, readonly, required, type, value</pre>
This is a big patch, i know. We want to rewrite the wizard in Version 8 so that it is no longer necessary to touch so many files. But at the moment there is no alternative.
A litte help for the review:
The file
<pre>typo3/sysext/form/Resources/Public/JavaScript/Wizard/Viewport/Left/Options/Forms/Attributes.js</pre>
contains all the new attributes for the wizard.
There are 2 files for each element:
* typo3/sysext/form/Classes/Domain/Model/Json/ButtonJsonElement.php
* typo3/sysext/form/Resources/Public/JavaScript/Wizard/Elements/Basic/Button.js
This files must include all the above defined attributes.
The wizard show only a few attributes by default.
To see all the attributes for the elements, you have to write the following configuration in <pre>typo3/sysext/form/Configuration/PageTS/modWizards.ts</pre>
<pre>
mod.wizards {
newContentElement.wizardItems {
forms {
show :=addToList(mailform)
elements {
mailform {
iconIdentifier = content-elements-mailform
title = LLL:EXT:backend/Resources/Private/Language/locallang_db_new_content_el.xlf:forms_mail_title
description = LLL:EXT:backend/Resources/Private/Language/locallang_db_new_content_el.xlf:forms_mail_description
tt_content_defValues {
CType = mailform
bodytext (
enctype = multipart/form-data
method = post
prefix = tx_form
)
}
}
}
}
}
form {
defaults {
showTabs = elements, options, form
tabs {
elements {
showAccordions = basic, predefined, content
accordions {
basic {
showButtons = checkbox, fieldset, fileupload, hidden, password, radio, reset, select, submit, textarea, textline, input
}
predefined {
showButtons = email, radiogroup, checkboxgroup, name
}
content {
showButtons = header, textblock
}
}
}
options {
showAccordions = legend, label, attributes, options, validation, filters, various
accordions {
attributes {
showProperties = accept, accept-charset, accesskey, action, alt, autocomplete, autofocus, checked, class, cols, contenteditable, contextmenu, dir, draggable, dropzone, disabled, enctype, hidden, height, id, inputmode, label, lang, list, max, maxlength, method, min, minlength, multiple, name, novalidate, pattern, placeholder, readonly, required, rows, selected, selectionDirection, selectionEnd, selectionStart, size, spellcheck, src, step, style, tabindex, title, translate, type, value, width, wrap
}
label {
showProperties = label
}
validation {
showRules = alphabetic, alphanumeric, between, date, digit, email, equals, fileallowedtypes, filemaximumsize, fileminimumsize, float, greaterthan, inarray, integer, ip, length, lessthan, regexp, required, uri
rules {
alphabetic {
showProperties = message, error, breakOnError, showMessage, allowWhiteSpace
}
alphanumeric {
showProperties = message, error, breakOnError, showMessage, allowWhiteSpace
}
between {
showProperties = message, error, breakOnError, showMessage, minimum, maximum, inclusive
}
date {
showProperties = message, error, breakOnError, showMessage, format
}
digit {
showProperties = message, error, breakOnError, showMessage
}
email {
showProperties = message, error, breakOnError, showMessage
}
equals {
showProperties = message, error, breakOnError, showMessage, field
}
fileallowedtypes {
showProperties = message, error, breakOnError, showMessage, types
}
filemaximumsize {
showProperties = message, error, breakOnError, showMessage, maximum
}
fileminimumsize {
showProperties = message, error, breakOnError, showMessage, minimum
}
float {
showProperties = message, error, breakOnError, showMessage
}
greaterthan {
showProperties = message, error, breakOnError, showMessage, minimum
}
inarray {
showProperties = message, error, breakOnError, showMessage, array, strict
}
integer {
showProperties = message, error, breakOnError, showMessage
}
ip {
showProperties = message, error, breakOnError, showMessage
}
length {
showProperties = message, error, breakOnError, showMessage, minimum, maximum
}
lessthan {
showProperties = message, error, breakOnError, showMessage, maximum
}
regexp {
showProperties = message, error, breakOnError, showMessage, expression
}
required {
showProperties = message, error, breakOnError, showMessage
}
uri {
showProperties = message, error, breakOnError, showMessage
}
}
}
filtering {
showFilters = alphabetic, alphanumeric, currency, digit, integer, lowercase, regexp, removexss, stripnewlines, titlecase, trim, uppercase
filters {
alphabetic {
showProperties = allowWhiteSpace
}
alphanumeric {
showProperties = allowWhiteSpace
}
currency {
showProperties = decimalPoint, thousandSeparator
}
digit {
showProperties =
}
integer {
showProperties =
}
lowercase {
showProperties =
}
regexp {
showProperties = expression
}
removexss {
showProperties =
}
stripnewlines {
showProperties =
}
titlecase {
showProperties =
}
trim {
showProperties = characterList
}
uppercase {
showProperties =
}
}
}
}
}
form {
showAccordions = behaviour, prefix, attributes, postProcessor
accordions {
attributes {
showProperties = accept, accept-charset, action, class, dir, enctype, id, lang, method, name, style, title
}
postProcessor {
showPostProcessors = mail, redirect
postProcessors {
mail {
showProperties = recipientEmail, senderEmail, subject
}
redirect {
showProperties = destination
}
}
}
}
}
}
}
elements {
form {
accordions {
attributes {
showProperties = accesskey, class, contenteditable, contextmenu, dir, draggable, dropzone, hidden, id, lang, spellcheck, style, tabindex, title, translate, accept, accept-charset, action, autocomplete, enctype, method, name, novalidate
}
}
}
button {
showAccordions = attributes
accordions {
attributes {
showProperties = accesskey, class, contenteditable, contextmenu, dir, draggable, dropzone, hidden, id, lang, spellcheck, style, tabindex, title, translate, autofocus, disabled, name, type, value
}
}
}
checkbox {
showAccordions = label, attributes, validation
accordions {
attributes {
showProperties = accesskey, class, contenteditable, contextmenu, dir, draggable, dropzone, hidden, id, lang, spellcheck, style, tabindex, title, translate, autofocus, checked, disabled, name, readonly, required, type, value
}
validation {
showRules = required
}
}
}
fieldset {
showAccordions = legend
}
fileupload {
showAccordions = label, attributes, validation
accordions {
attributes {
showProperties = accesskey, class, contenteditable, contextmenu, dir, draggable, dropzone, hidden, id, lang, spellcheck, style, tabindex, title, translate, accept, autofocus, disabled, multiple name, readonly, required, type, value
}
validation {
showRules = required, fileallowedtypes, filemaximumsize, fileminimumsize
}
}
}
hidden {
showAccordions = attributes
accordions {
attributes {
showProperties = accesskey, class, contenteditable, contextmenu, dir, draggable, dropzone, hidden, id, lang, spellcheck, style, tabindex, title, translate, name, type, value
}
}
}
input {
showAccordions = label, attributes, validation, filters
accordions {
attributes {
showProperties = accesskey, class, contenteditable, contextmenu, dir, draggable, dropzone, hidden, id, lang, spellcheck, style, tabindex, title, translate, accept, autocomplete, autofocus, checked, disabled, inputmode, list, max, maxlength, min, minlength, multiple, name, pattern, placeholder, readonly, required, size, step, type, value
}
validation {
showRules = alphabetic, alphanumeric, between, date, digit, email, equals, float, greaterthan, inarray, integer, ip, length, lessthan, regexp, required, uri
}
filtering {
showFilters = alphabetic, alphanumeric, currency, digit, integer, lowercase, regexp, titlecase, trim, uppercase
}
}
}
password {
showAccordions = label, attributes, validation
accordions {
attributes {
showProperties = accesskey, class, contenteditable, contextmenu, dir, draggable, dropzone, hidden, id, lang, spellcheck, style, tabindex, title, translate, autocomplete, autofocus, disabled, maxlength, minlength, name, pattern, placeholder, readonly, required, size, type, value
}
validation {
showRules = required, equals
}
}
}
radio < .checkbox
reset < .button
select {
showAccordions = label, attributes, options, validation
accordions {
attributes {
showProperties = accesskey, class, contenteditable, contextmenu, dir, draggable, dropzone, hidden, id, lang, spellcheck, style, tabindex, title, translate, autofocus, disabled, multiple, name, required, size
}
validation {
showRules = required
}
}
}
submit < .button
textarea {
showAccordions = label, attributes, validation, filters
accordions {
attributes {
showProperties = accesskey, class, contenteditable, contextmenu, dir, draggable, dropzone, hidden, id, lang, spellcheck, style, tabindex, title, translate, autofocus, cols, disabled, inputmode, maxlength, minlength, name, placeholder, readonly, required, rows, selectionDirection, selectionEnd, selectionStart, wrap
}
filtering {
showFilters = alphabetic, alphanumeric, lowercase, regexp, stripnewlines, titlecase, trim, uppercase
}
validation {
showRules = alphabetic, alphanumeric, length, regexp, required
}
}
}
textline {
showAccordions = label, attributes, validation, filters
accordions {
attributes {
showProperties = accesskey, class, contenteditable, contextmenu, dir, draggable, dropzone, hidden, id, lang, spellcheck, style, tabindex, title, translate, autocomplete, autofocus, disabled, inputmode, list, maxlength, minlength, name, pattern, placeholder, readonly, required, size, type, value
}
validation {
showRules = alphabetic, alphanumeric, between, date, digit, email, equals, float, greaterthan, inarray, integer, ip, length, lessthan, regexp, required, uri
}
filtering {
showFilters = alphabetic, alphanumeric, currency, digit, integer, lowercase, regexp, titlecase, trim, uppercase
}
}
}
checkboxgroup {
showAccordions = legend, options, various, validation
accordions {
validation {
showRules = required
}
}
}
email < .textline
header {
showAccordions = various
}
textblock {
showAccordions = various
}
name {
showAccordions = legend, various
}
radiogroup < .checkboxgroup
}
}
}
</pre>