Question

For a while now I’ve been wrestling with the issue of dynamic forms that change depending on previous input. This is my first Symfony project, so I’m still getting the hang of how everything works together.

What I have is a form type for selecting periods of time. There are preset periods (such as 1min, 5min, 30min, 1hour etc) and a custom text box for entering a certain number of seconds. This form can be embedded in other forms, so (afaik) doesn’t have a standard ID that can be accessed. I would like the custom time text box to be only visible if the “Custom Time” (empty value) is selected from the preset time list.

Alternately, the preset values could just write a value in seconds to the custom value (and would need to have the preset box changed to custom on modification of the custom text box). That would be acceptable too.

If the form builder wasn’t being used, this would be trivial JavaScript but rather than hacking something together, I would much rather do it properly in reusable code so that I know for the future. To my way of thinking, if there was a way of specifying a custom form rendering template in the form type itself that applied only to that form, that would be fantastic.

Fingers crossed that there’s a good solution to this!

Edited: Also, I’m using Twig for rendering all my views.

Answer 1

Results of a bit of research concluded that the best way to do this is to add field overrides for the widget:

/src/PWT/DataBundle/Resources/views/Form/fields.html.twig:

{% block periodChoose_widget %}
    <script type="text/javascript" src="{{ asset('bundles/databundle/js/periodChoose.js') }}"></script>
    {{ block('form_widget') }}
{% block %}

Then add the following to each of the app/bundle config files:

/app/config/config.yml:

imports:
    data_bundle:
        resource: @PWTDataBundle/Resources/config/config.yml

/src/PWT/DataBundle/Resources/config/config.yml:

# Twig Configuration
twig:
    form:
        resources:
            - 'PWTDataBundle:Form:fields.html.twig'

I realized that I would need to add something in the global app config if I wanted to reuse the form across multiple bundles. This allows the bundle to be reasonably self contained, with only a small reference in the overall app config. The javascript is not included until the form is used, and the twig block has very little overhead compared to other solutions (afaik).

This way, the javascript that goes with the form is included whenever it is used, and to modify it only requires modification of the bundle, not anything in the overall app config/views. It also breaks the views up so that they don’t have a long list of extends this, extends that (like would need to be applied if you had a bundle style that added formTheme tag to override on the base bundle template).

Some of those last 2 paragraphs is speculation, and there could easily be a far better way to do this but this is an adequate fit for me to move on. If anyone has a better solution, I would be happy to read about it.