Major Productions
Major Productions

Reputation: 6042

Symfony 3.4, MoneyType, and Bootstrap

I'm having a bit of difficulty styling a MoneyType form input the way I want. I want to use Bootstrap's input-group-addon class to prepend a dollar sign to the field, but what's actually happening is that two dollar signs are being rendered... one automatically generated by the MoneyType, and one that I manually wrote in my template:

Template:

<div class="form-group">
    {{ form_label(form.canonicalPrice) }}
    {{ form_errors(form.canonicalPrice) }}
    <div class="input-group">
        <span class="input-group-addon">$</span>
        {{ form_widget(form.canonicalPrice, { 'attr': {'id': 'price', 'class': 'form-control'} }) }}
    </div>
</div>

MoneyType definition in my form type class:

->add('canonicalPrice', MoneyType::class, array('label' => 'Price', 'currency' => 'USD'))

Screenshot:

enter image description here

So, is there a way for me to either:

  1. Hide the automatic currency label that Symfony adds with a MoneyType field? Not specifying any currency defaults to a Euro rather than dollar, which isn't helpful.
  2. Style the automatic label the way I want?

Note: I'm not using Symfony's Bootstrap form themes because I like having complete control over my templates. The fact that MoneyType fields default to showing a currency is very annoying.

Upvotes: 1

Views: 1024

Answers (1)

Dylan KAS
Dylan KAS

Reputation: 5713

Style the automatic label :

The dollar sign that is prepend to the input is from the money_pattern attribute of MoneyType So as the doc on MoneyType says you can :

Modify in it the view :

{{ form_row(form.value, { 'money_pattern': '{{ widget }} $' }) }}

or like this

{% block money_widget %}
    {%- set type = type|default('number') -%}
    {{ parent() }}
{% endblock %}

Modify it in the builder :

Use money_pattern in the FormType and set the pattern you want.

Upvotes: 3

Related Questions