Symfony2 - data collector - combines form types into one

I want to create a reusable datetime assembly in symfony2. The idea is that it will consist of 3 separate input parameters. I will clarify the question with full information so that other people can use my findings.

{text entry} {select hour} {select time}

The question is how to create a custom reusable form that combines 3 inputs into one.

I attached a screenshot to give an idea of ​​what im trying to achieve

enter image description here

symfony docs http://symfony.com/doc/current/cookbook/form/create_custom_field_type.html#creating-a-template-for-the-field

+7
forms symfony datepicker datetimepicker
source share
2 answers

You can simply use jquery.datetime picker to show the data collector or just one of them (date or time).

I recently did one of my websites.

$builder->add('dateheure', 'datetime', array('date_widget' => "single_text", 'time_widget' => "single_text")); 

and call jquery, datetime css and js on your page:

 <link rel="stylesheet" type="text/css" href="jquery.datetimepicker.css"/ > <script src="jquery.js"></script> <script src="jquery.datetimepicker.js"></script> 

and then the active datetimepicker in your fields:

 $(function(){ $("#form_dateheure input").each(function(){ $(this).attr("readonly","readonly"); }); $('#form_dateheure_date').datetimepicker({ format: "Ymd", timepicker: false, datepicker: true, }); $('#form_dateheure_time').datetimepicker({ format: "H:i", timepicker: true, datepicker: false, step:5 }); }); 
+13
source share

As an example, you can see DateTime . Check the source code .

In general, first create a custom form type that, when you can add to your forms. As an example

 class DateTimeType extends AbstractType { public function buildForm(FormBuilderInterface $builder, array $options) { $builder->add('date', 'text'); $builder->add('hour', 'choice', array(...)); $builder->add('minute', 'choice', array(...)); } public function setDefaultOptions(OptionsResolverInterface $resolver) { } public function getParent() { return 'form'; } public function getName() { return 'date_time'; } } 

Second, add a Data Transformer to it, which converts your html data from the 3rd field into a single DateTime object.

+1
source share

All Articles