Bug #26481

Task #26664: Clean up Form ViewHelpers

Task #26658: Make Form ViewHelpers consistent

hidden fields should be rendered in extra section

Added by Sven-S. Porst almost 10 years ago. Updated almost 9 years ago.

Status:
Resolved
Priority:
Should have
Category:
ViewHelpers
Start date:
2011-04-29
Due date:
% Done:

100%

Estimated time:
Has patch:
No

Description

The form.checkbox view helper works in an unexpected way because it creates two, rather than one <input> elements.

This is a problem when using markup like

<label>
  <f:form.checkbox ...>
  Checkbox name
</label>

as one ends up having two <input>s inside the <label> which is invalid HTML. One has to make the effort to create id and for attributes for both tags to get things working correctly. This could be simpler.

In the long term it may be worth considering to add explicit support for <label> tags to the form field view helpers, to encourage label usage by offering straightforward support for it from the templating engine.

UPDATE: The solution would be to render the "automatically generated" hidden fields for checkboxes and select dropdowns in the hidden fields section at the beginning of a form


Related issues

Related to TYPO3.Fluid - Bug #33628: Multicheckboxes (multiselect) for Collections don’t workNeeds FeedbackChristian Müller2012-02-02

Actions
Related to TYPO3.Fluid - Task #13342: f:form.checkbox does only render hidden input for first item of same nameResolvedBastian Waidelich2011-02-24

Actions
#1

Updated by Bastian Waidelich almost 10 years ago

  • Status changed from New to Needs Feedback
  • Assignee set to Bastian Waidelich

Sven-S. Porst wrote:

as one ends up having two <input>s inside the <label> which is invalid HTML.

Why do you think, that this is invalid HTML?
Try to validate this:

<?xml version="1.0" encoding="utf-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" 
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
 <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
 <head>
    <title>Form test</title>
    <meta http-equiv="Content-Type" content="application/xhtml+xml; charset=UTF-8" />
    <meta http-equiv="Content-Style-Type" content="text/css" />
 </head>
 <body>
    <form action="foo" method="post">
        <ul>
            <li>
                <label>Foo <input type="hidden" name="foo" value="" /><input type="checkbox" name="foo" value="bar" /></label>
            </li>
        </ul>
    </form>
</body>
</html>

on http://validator.w3.org/#validate_by_input

#2

Updated by Sven-S. Porst almost 10 years ago

Try validating against HTML 5.

Besides: If you're using the markup in your example you'll notice that it doesn't work as expected – clicking the label will not select the checkbox (presumably because the browser implicitly associates the label to the first <input> element it contains in this ambiguous situation). So it's poor usability which is how I found this problem to begin with. In fact, I'm surprised doing this was valid in HTML 4.

#3

Updated by Bastian Waidelich almost 10 years ago

Sven-S. Porst wrote:

Try validating against HTML 5.
[...] it doesn't work as expected [...]

Good point(s) ;)
I'm not sure how to solve this though.. I don't think, that the form view helper should output the label, because then you'd have to be able to specify some kind of template for the exact output.
Maybe a solution would be to make the hidden field optional (<f:form.checkbox createHiddenField="false" />) so that you'd be able to render it yourself. To avoid a lot of duplicate template code, you could put this into a partial:

<li>
    <f:form.hidden property="{property}" value="" />
    <label>
        {label}
        <f:form.checkbox property="{property}" createHiddenField="false" />
    </label>
</li>

and use it like:

<f:render partial="Checkbox" arguments="{property: 'foo', label: 'Foo'} />

what do you think?

#4

Updated by Sven-S. Porst almost 10 years ago

The createHiddenField approach would certainly help with my specific problem.

On the other hand, adding an extra paramter would add addional complexity to the view helper's interface, so I'm not sure this is a really good solution if the templating is meant to be easy to use.

If one needs those hidden fields, a more elegant solution would be if the hidden fields were not inserted directly by the form field's view helper but collected by the containing form view helper and then inserted at the beginning of the form.

#5

Updated by Bastian Waidelich almost 10 years ago

  • Assignee changed from Bastian Waidelich to Sebastian Kurfuerst

Sven-S. Porst wrote:

[...] a more elegant solution would be if the hidden fields were not
inserted directly by the form field's view helper but collected by the containing
form view helper and then inserted at the beginning of the form.

I like this idea. The form already renders a section with hidden fields anyways.. Assigning this to Sebastian so he can give his input. Sebastian Kurfuerst feel free to re-assign this to me

#6

Updated by Sebastian Kurfuerst almost 10 years ago

  • Assignee changed from Sebastian Kurfuerst to Bastian Waidelich

Nice idea! However it must be at the beginning of the form. I am not sure, if the referrers are added before or after?

So, +1 to changing it so they are added at the beginning of the form!

Greets,
Sebastian

#7

Updated by Sven-S. Porst almost 10 years ago

The referrers are inserted at the beginning of the form. So the setup seems to be just right.

#8

Updated by Sebastian Kurfuerst almost 10 years ago

  • Parent task set to #26658
#9

Updated by Robert Lemke over 9 years ago

  • Target version changed from 1.0 beta 2 to 1.0.0
#10

Updated by Bastian Waidelich over 9 years ago

  • Subject changed from form field view helpers could do with better support for <label> to render fluid hidden fields in extra section
  • Has patch set to No
#11

Updated by Bastian Waidelich over 9 years ago

  • Status changed from Needs Feedback to Accepted
#12

Updated by Karsten Dambekalns over 9 years ago

  • Target version deleted (1.0.0)
#13

Updated by Bastian Waidelich almost 9 years ago

  • Target version set to 1.1
#14

Updated by Karsten Dambekalns almost 9 years ago

  • Target version changed from 1.1 to 1.1 RC1
#15

Updated by Bastian Waidelich almost 9 years ago

Sorry for the delay on this one. I take care of implementing this for 1.1!

#16

Updated by Bastian Waidelich almost 9 years ago

  • Tracker changed from Task to Bug
  • Subject changed from render fluid hidden fields in extra section to hidden fields should be rendered in extra section
#17

Updated by Gerrit Code Review almost 9 years ago

  • Status changed from Accepted to Under Review

Patch set 1 for branch master has been pushed to the review server.
It is available at http://review.typo3.org/11648

#18

Updated by Sebastian Kurfuerst almost 9 years ago

  • Status changed from Under Review to Resolved
  • % Done changed from 0 to 100
#19

Updated by Gerrit Code Review almost 9 years ago

  • Status changed from Resolved to Under Review

Patch set 1 for branch FLOW3-1.1 has been pushed to the review server.
It is available at http://review.typo3.org/12158

#20

Updated by Bastian Waidelich almost 9 years ago

  • Status changed from Under Review to Resolved

Also available in: Atom PDF