8000 [Form] Adding Stimulus code by ThomasLandauer · Pull Request #17364 · symfony/symfony-docs · GitHub
[go: up one dir, main page]

Skip to content

[Form] Adding Stimulus code #17364

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.

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

Merged
merged 1 commit into from
Nov 3, 2022
Merged

Conversation

ThomasLandauer
Copy link
Contributor

See #17355 (comment)

Please merge this first, then I'll add the same down at the "Allowing Tags to be Removed" section.

Copy link
Member
@weaverryan weaverryan left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

This looks good to me - just one minor comment :)

I think we can add the remove tags to this PR right now - your approach looks good to me.

@ThomasLandauer
Copy link
Contributor Author
ThomasLandauer commented Oct 18, 2022

"Remove" links:
The current approach adds them dynamically with JavaScript. But I'm usually doing it in Twig right away:

{% for tag in form.tags %}
    <li>
        {{ form_row(tag.name) }}
        <button ...> {# <= Here #}
    </li>
{% endfor %}

...which lacks the possibility to "re-remove" a "just-added" item. But it makes the JavaScript so much easier ;-)

Bottom line: I haven't thought about how to do something like the current addTagFormDeleteLink() in Stimulus ;-)

@weaverryan
Copy link
Member

The current approach adds them dynamically with JavaScript. But I'm usually doing it in Twig right away:

I think you could do this with form themes? https://symfony.com/doc/current/form/form_themes.html#fragment-naming-for-collections

So, you'd override, for example, a block called _task_tags_entry_row (this needs to be double-checked) where you could render effectively what you have in the for loop. Then, this would be used for each existing entry and would also be used for the prototype.

@ThomasLandauer
Copy link
Contributor Author

This is starting to get complicated ;-) So I'd say: Please merge this PR as-is, so we can see what it looks like in practice.

And for the "Delete" button, I now see three ways to do it:

  • for in Twig: Quick and dirty (cannot re-remove just added entries)
  • existing approach by adding the buttons with JavaScript: Probably better but more complicated JavaScript; plus some delay when opening a long page
  • form themes: Most complicated, but certainly the best outcome.

So the big question is: Do you want to show all three?

@weaverryan
Copy link
Member

My vote would be just the form theme. That would also work for the “vanilla javascript” example as well.

however, if we want a smaller change for just this PR, I’d vote for adding the delete button via js in the stimulus controller. So, the stimulus version of what’s done in the vanilla js section.

I’d really like to not merge this in a half done state - in practice, sometimes that second PR gets delayed and the docs sit in a half done state for too long :)

@ThomasLandauer
Copy link
Contributor Author
ThomasLandauer commented Oct 20, 2022

Current PR: Sorry, but I've put too much work into some PR's (even on this very page) that were never merged cause in the end somebody said, it's too large and impossible to review (e.g. #10180 (comment) or #11222 (comment)). And when we switch this page to form themes, I fear this will happen again, cause it's going to be a major change (see below).

I don't see this PR as incomplete. After all, showing 1 of 2 steps in Stimulus is certainly better than showing 0 of 2 ;-)

If we do want to advise people to use form themes, the current section (about adding tags) needs to be refined again - at least this note has to go:

If you want to customize the HTML code in the prototype, see How to Work with Form Themes.

Besides, I would try again to find a way to separate PHP and JavaScript better.

Copy link
Member
@weaverryan weaverryan left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Fair enough - let's merge in this state, as it is already an improvement, even if we don't yet show how to remove items. We can continue to iterate on it.

@carsonbot carsonbot changed the title Adding Stimulus code [Form] Adding Stimulus code Nov 3, 2022
@javiereguiluz javiereguiluz added this to the 6.1 milestone Nov 3, 2022
@javiereguiluz
Copy link
Member

Thank you Thomas.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Development

Successfully merging this pull request may close these issues.

4 participants
0