Marc
Marc

Reputation: 9537

Symfony 2 - How to remove the default date picker of the Date Field Type?

In my formType I use the following to render my Date Field Type.

$builder->add('date_naissance', 'date', array(
            'input'  => 'datetime',
            'widget' => 'single_text',
        ));

Here belox how it is rendered. My problem is that i want to use a jquery picker and the thing is that the input seems to contain already by default some ugly widget to select the date. My question is simple. How can I get reed of that default date picker. Thank you in advance for your replies. Cheers. Marc

enter image description here

Upvotes: 3

Views: 11521

Answers (5)

Andrew Atkinson
Andrew Atkinson

Reputation: 4251

Edit, since symfony 2.6

You can now use the html5 field option like:

->add('date', DateType::class, ['html5' => false]);

This will remove the html5 type="date" on the form view.


It is a HTML5 datepicker. the html will have

type="date"

which is output by symfony by default, as it should.

Chrome will see this and do the datepicker,

Some ideas to resolve your issue:

  1. Change the format in the form builder:

    $builder->add('date_created', DateType::class, array( 'widget' => 'single_text'));

    Read more here: http://symfony.com/doc/current/reference/forms/types/date.html#format

  2. Remove browser datepicker: https://stackoverflow.com/a/11470344/744975

  3. Override the browsers datepicker with one from another javascript library: https://jqueryui.com/datepicker/ (My preferred option)

Upvotes: 13

b.b3rn4rd
b.b3rn4rd

Reputation: 8830

Starting from symfony 2.6 you can set 'html5' => false in order to disable HTML5 type.

Example:

$builder->add('establishment_date', 'date', array(
        'label'   => 'Establishment date',
        'widget'  => 'single_text',
        'html5'   => false,
));

Upvotes: 9

Gabriel Pillet
Gabriel Pillet

Reputation: 1

You can do that by overriding the form_widget_simple in a twig theme (see http://symfony.com/doc/current/cookbook/form/form_customization.html)

{% block form_widget_simple %}
{% spaceless %}
    {% set type = type|default('text') == 'date' ? 'text' : type|default('text') %}
    <input type="{{ type }}" {{ block('widget_attributes') }} {% if value is not empty %}value="{{ value }}" {% endif %}/>
{% endspaceless %}
{% endblock form_widget_simple %}

Upvotes: 0

valdas.mistolis
valdas.mistolis

Reputation: 1341

Simply change default type to text inside twig:

{{form_widget(dateField, {'type':'text'})}}

Upvotes: 5

Schwierig
Schwierig

Reputation: 712

That's not really a problem coming from Symfony. I don't have that kind of datepicker when I generate my date fields. Check your page in different browsers and/or check for some bundles you may have implemented, that generate this field.

Upvotes: 4

Related Questions