[MGNLFORM-196] Use HTML5 markup for forms and define new controls Created: 24/Apr/12  Updated: 15/Apr/16  Resolved: 29/Oct/15

Status: Closed
Project: Magnolia Form Module
Component/s: field, validation
Affects Version/s: None
Fix Version/s: 2.3.2

Type: Story Priority: Critical
Reporter: Boris Kraft Assignee: Roman Kovařík
Resolution: Fixed Votes: 1
Labels: next
Remaining Estimate: 0d
Time Spent: 2h 28m
Original Estimate: Not Specified

Attachments: PNG File screenshot-1.png    
Issue Links:
Relates
causality
is causing MGNLFORM-279 formEdit with inputType password esca... Closed
dependency
is depended upon by MGNLUI-1720 Email input field does not give ipad ... Open
Template:
Acceptance criteria:
Empty
Task DoD:
[ ]* Doc/release notes changes? Comment present?
[ ]* Downstream builds green?
[ ]* Solution information and context easily available?
[ ]* Tests
[ ]* FixVersion filled and not yet released
[ ]  Architecture Decision Record (ADR)
Date of First Response:
Epic Link: MTE > 1.0
Sprint: Kromeriz 16
Story Points: 5

 Description   

While we claim that Magnolia 4.5 uses the html5 forms support it really doesn't. Even the Email form-field is of type input instead of type email.

What we should do and do so soon is to add the html5 input types to Magnolia's form module.

These are the input types html5 supports natively:

  • text - text-input field
  • password - password-input field
  • checkbox - checkbox
  • radio - radio button
  • button - button
  • submit - submit button
  • reset - reset button
  • file - file upload control
  • hidden - hidden input control
  • image - image-coordinates input control
  • datetime - global date-and-time input control NEW
  • datetime-local - local date-and-time input control NEW
  • date - date input control NEW
  • month - year-and-month input control NEW
  • time - time input control NEW
  • week - year-and-week input control NEW
  • number - number input control NEW
  • range - imprecise number-input control NEW
  • email - e-mail address input control NEW
  • url - URL input control NEW
  • search - search field NEW
  • tel - telephone-number-input field NEW
  • color - color-well control NEW

And at the very minimum we need to update the email field to be of type email!

Also we should implement the HTML5 placeholder attribute to display dim text in the input or description field, that dissapears as soon as user enters a value. (See http://davidwalsh.name/html5-placeholder)



 Comments   
Comment by Evzen Fochr [ 29/Oct/15 ]

incorrect i18n change from label to buttonLabel

add formNumber to /modules/form/templates/components/formGroupFields/areas/fields/availableComponents

missing tel input type

Generated at Mon Feb 12 05:37:49 CET 2024 using Jira 9.4.2#940002-sha1:46d1a51de284217efdcb32434eab47a99af2938b.