Symfony's NumberType as HTML5 input field and a custom locale setting

Question

My application prefers de as locale to show numbers like 1.234.567,89 instead of 1,234,567.89 (or 1234567,89 instead of 1234567.89).

So i have changed the local parameter in the config.yml:

parameters:
    locale: de

Furthermore i use the NumberType to generate my form fields:

class MyFormType extends AbstractType
{

    public function buildForm(FormBuilderInterface $builder, array $options)
    {
        $builder->add('myNumber', NumberType::class, [
            'label'    => 'Tax [EURO]',
            'required' => false,
            'scale'    => 2,
            'attr'     => array(
                'min'  => 0,
                'max'  => 9999.99,
                'step' => 0.01,
            ),
        ]);
    }
}

Now the value of myNumber is shown as a german formatted number the generated HTML5 input field and the field does either work nor show any number. If i change back the locale to en everything is working fine.

IMO the html5 input field needs to be filled with an english formatted number. But how can i manage to output the number not as german?

Summary

With locale de the field does not work. The value is not displayed in the generated input field although the value attribute is filled correctly with the german formatted number: <input type="number" value="1234567,89">

With locale en the field works: <input type="number" value="1234567.89">

Funny fact: My browsers (Firefox 45.9.0 and Google Chrome v54.0.2840.71, debian/64-bit) detect my computer's locale settings de and shows the the number as a german formatted number even if i ste the application's locale to en (onlinput fields of type number)

Adding the lang attribute <html lang="{{ app.request.locale }}"> did not helped.

Thanks a lot!

score 3 · Answer 1 · answered Jun 23 '17 at 13:31

Fixed the problem... do not use symfony's NumberType for HTML5 input elements of type number!

Instead use the common TextType form type

public function buildForm(FormBuilderInterface $builder, array $options)
{
    $builder->add('myNumber', TextType::class, [...]);
}

and add the attribute type="number" via the template. For instance with the Twig engine you can use following code:

{{ form_widget(form.myNumber, {'type':'number', 'lang': app.request.locale}) }}

I don't know if it is the recommended way , but it does the trick ;) Thks — Kojo, Jul 02 '19 at 18:17

score 0 · Answer 2 · answered Jun 22 '17 at 14:19

you could try to set the html lang attribute

<html lang="de">

but i think you should rather use the pattern attribute instead of number, because you cant rely on the browsers decision, check out this article https://ctrl.blog/entry/html5-input-number-localization

sth like

<input type="number" pattern="[0-9]+([,\.][0-9]+)?"

which will allow comma as well as dot

Symfony's NumberType as HTML5 input field and a custom locale setting

Summary

2 Answers2

Linked