Thanks to visit codestin.com
Credit goes to github.com

Skip to content

[Twig/Forms] not possible to set title for button without text #34330

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom
Closed
poolerMF opened this issue Nov 12, 2019 · 8 comments
Closed

[Twig/Forms] not possible to set title for button without text #34330

poolerMF opened this issue Nov 12, 2019 · 8 comments
Labels
Feature TwigBridge

Comments

@poolerMF
Copy link

Symfony version(s) affected: every ?

Description

  • I'm creating form button, that has only icon ... It's not possible to define title for button, that has no text

How to reproduce

$builder->add('reset', ResetType::class, [
	'label' => false,
	'attr' => [
		'title' => 'word.reset_filter'
	]
]);

My Solution
override block button_widget

{% block button_widget -%}
    {% set original_translation_domain = translation_domain %}
    ....
{%- endblock button_widget %}

override block button_attributes

{%- block button_attributes -%}
    {% set translation_domain = original_translation_domain %}
    id="{{ id }}" name="{{ full_name }}"{% if disabled %} disabled="disabled"{% endif -%}
    {{ block('attributes') }}
{%- endblock button_attributes -%}
@xabbuh
Copy link
Member

xabbuh commented Nov 14, 2019

Which form theme do you use?

@poolerMF
Copy link
Author

I was using bootstrap_4_layout
I tried it on SF 4.2.10

@stephen-lewis
Copy link
Contributor

I've had a go at reproducing this, but I can't seem to do so. By setting label to false and setting attr['title'] as you have, the title comes through fine for me. This is on 4.3.8, mind you, the latest stable version. Bootstrap 4 form styling all configured.

My reproduction attempt is at https://github.com/stephen-lewis/symfony_bug_34330_reproducer, and as you can see by the screenshot below, the title attribute is there (a tooltip also displays, but I couldn't capture that!).

Perhaps there is something else going wrong... I'd start by upgrading to 4.3.x. Then, if the issue persists, can you give some more detail so we can reproduce it?

image

@poolerMF
Copy link
Author

I'm sorry, my fault - bad description and title

it's not possible to translate title for button without text
it's bug about translations (that's why I was in my solution remembering old translation_domain)

@stephen-lewis
Copy link
Contributor

No worries, your workaround makes more sense now! I've reproduced it in latest; can confirm issue:
'title' attribute is not translated when label is null. Issue persists without bootstrap or bootstrap form theme.

@stephen-lewis stephen-lewis mentioned this issue Nov 18, 2019
Closed
@stephen-lewis
Copy link
Contributor

stephen-lewis commented Nov 18, 2019 •
edited
Loading

button_widget explicitly sets translation_domain to false if label==false. translation_domain is then checked for false to avoid breaking the translator if it tries to translate a non-string. I've created a pull request that changes this logic to check both the label and the translation_domain for false prior to translating, and then removed the explicit setting of translation_domain to false. I've tested it and there does't seem to be any side effects.

EDIT: grammar

@stephen-lewis stephen-lewis mentioned this issue Jan 3, 2020
Merged
@TomaszGasior
Copy link

TomaszGasior commented Jan 3, 2020 •
edited
Loading

@poolerMF Creating button without text should not be possible. You SHOULD never ever create button without text and only with icon. Button without text inside is not accessible for screen readers, which means that blind people won't be able to use that button (title attr is not solution here).

It does not mean that you cannot hide text button. You can if your design requires this. But in HTML itself (in this case, in HTML generated by Symfony Form component & Twig) text should be placed inside the button but YOU should wrap that text around some wrapper with visually hidden class which hides contents from the screen but keeps it available for blind people. Proper .visually-hidden implementation example: https://a11yproject.com/posts/how-to-hide-content/

To fix your problem you can:

  • create custom form extenstion to add new setting like "visually_hidden_label" to ButtonType and friends,
  • create your own form theme and override ButtonType's form_label block to wrap label text itself in <span class="visually-hidden"> wrapper only when "visually_hidden_label" setting is true.

@poolerMF
Copy link
Author

poolerMF commented Jan 3, 2020 •
edited
Loading

@TomaszGasior the button may have an icon where text is not needed ... but title is required

@fabpot fabpot closed this as completed Jan 7, 2020
fabpot added a commit that referenced this issue Jan 7, 2020
@fabpot
bug #35193 [TwigBridge] button_widget now has its title attr translat…
aaf6915 
…ed even if its label = null or false (stephen-lewis)

This PR was squashed before being merged into the 3.4 branch (closes #35193).

Discussion
----------

[TwigBridge] button_widget now has its title attr translated even if its label = null or false

| Q             | A
| ------------- | ---
| Branch?       | 3.4
| Bug fix?      | yes
| New feature?  | no
| Deprecations? | no
| Tickets       | Fix #34330
| License       | MIT
| Doc PR        | TODO

Duplicate of #34436 but changed to bugfix and applied to 3.4. Buttons with null or false 'label' options will now have their 'title' attribute translated against the current translation domain.

Commits
-------

2a5d9cb [TwigBridge] button_widget now has its title attr translated even if its label = null or false
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Assignees
No one assigned
Labels
Feature TwigBridge
Projects
None yet
Milestone
No milestone
Development

Successfully merging a pull request may close this issue.

[TwigBridge] form button title attr will now trans for button without text stephen-lewis/symfony
5 participants
@fabpot @TomaszGasior @xabbuh @stephen-lewis @poolerMF