如何在Symfony2中显示月份下拉列表

时间:2012-04-12 14:21:06

标签: forms symfony

在我的应用程序中,用户只需在两个下拉列表中选择一个月和一年来给出日期。我怎样才能做到这一点?

这是我到目前为止所尝试的内容:

在我的表格中:

$builder->add('date1', 'date', array(
 'widget'      => 'choice',
 'empty_value' => '',
 'format'      => 'MMMM-yyyy',
 'input'       => 'datetime',
 'years'       => range(date('Y'), date('Y') - 30, -1)
)

实际上可以正常工作并按照我的要求显示它,但在验证表单时,我收到错误:

This value is not valid

想要结果的屏幕截图:

Screenshot

5 个答案:

答案 0 :(得分:9)

非常简单,日期时间需要一天!

您需要输出日期,如下所示:

        ->add(
            'ccExpirationDate',
            'date',
            array(
                'format'          => 'MMM-yyyy',
                'years'           => range(date('Y'), date('Y')+12),
                'days'            => array(1),
                'empty_value'     => array('year' => '----', 'month' => '----', 'day' => false)
            )
        )

TWIG:

{{ 
    form_widget(
        form.payment.ccExpirationDate.day, 
        { 
            'attr': { 'style': 'display:none' } }
        ) 
}}

答案 1 :(得分:9)

信用卡到期日期示例:

$builder->add('expirationDate', 'date', array(
 'label' => 'Expiration date',
 'widget' => 'choice',
 'empty_value' => array('year' => 'Year', 'month' => 'Month', 'day' => 'Day'),
 'format' => 'dd-MM-yyyy',
 'input' => 'string',
 'data' => date('Y-m-d'),
 'years' => range(date('Y'), date('Y') + 10),
));

然后您必须手动渲染此字段。

您的表单的树枝模板:

{{ form_row(form.expirationDate, {'date_pattern': '<span style="display: none;">{{ day }}</span> {{ month }} <span class="delim">&#47;</span> {{ year }}'}) }}

覆盖date_pattern将隐藏日期选择。您将获得月/年格式。

答案 2 :(得分:5)

我正在开发一种自定义表单类型,可以解决这个问题。该解决方案基于@ oleg-andreyev提出的建议。包含在表单类型中的逻辑。

用法:

<?php
$builder->add('exp_date', 'payum_credit_card_expiration_date');

表单类型代码:

<?php
namespace Payum\Bundle\PayumBundle\Form\Type;

use Symfony\Component\Form\AbstractType;
use Symfony\Component\Form\FormInterface;
use Symfony\Component\Form\FormView;
use Symfony\Component\OptionsResolver\OptionsResolverInterface;

class CreditCardExpirationDateType extends AbstractType
{
    public function finishView(FormView $view, FormInterface $form, array $options)
    {
        if ('choice' == $options['widget']) {
            if (empty($view['day']->vars['value'])) {
                $view['day']->vars['value'] = $view['day']->vars['choices'][0]->value;
            }

            $style = 'display:none';
            if (false == empty($view['day']->vars['attr']['style'])) {
                $style = $view['day']->vars['attr']['style'].'; '.$style;
            }

            $view['day']->vars['attr']['style'] = $style;
        }
    }

    public function setDefaultOptions(OptionsResolverInterface $resolver)
    {
        $resolver->replaceDefaults(array(
            'years' => range(date('Y'), date('Y') + 9)
        ));
    }

    public function getParent()
    {
        return 'date';
    }

    public function getName()
    {
        return 'payum_credit_card_expiration_date';
    }
}

您可以复制\粘贴它或注册payum包并使用此类型(将在下一个主要版本中提供)。

答案 3 :(得分:4)

@Oleg非常接近正确答案。您必须使用视图转换器来确保DateTime获得一天。

/* In your formType.php */

$builder->add(
   $builder->create('date1', 'date', array(
       'format'      => 'MMMM-yyyyd', // you need to have 'y', 'M' and 'd' here
       'years'       => range(date('Y'), date('Y') - 30, -1)
   ))
   ->addViewTransformer(new IncompleteDateTransformer()));
)

创建变压器:

class IncompleteDateTransformer implements DataTransformerInterface
{
/**
 * Do nothing when transforming from norm -> view
 */
public function transform($object)
{
    return $object;
}

/**
 * If some components of the date is missing we'll add those. 
 * This reverse transform will work when month and/or day is missing
 *
 */
public function reverseTransform($date)
{
    if (!is_array($date)) {
        return $date;
    }

    if (empty($date['year'])) {
        return $date;
    }

    if (empty($date['day'])) {
        $date['day']=1;
    }

    if (empty($date['month'])) {
        $date['month']=1;
    }

    return $date;
}
} 

创建一个树枝模板,您可以在其中使用文件本身的自定义表单主题:

{# example.html.twig #}
{% form_theme form _self %}

{% block date_widget %}
{% spaceless %}
    {% if widget == 'single_text' %}
        {{ block('field_widget') }}
    {% else %}
        <div {{ block('widget_container_attributes') }}>
            <div class="datetime_widget">
                {{ date_pattern|replace({
                '{{ year }}': form_widget(form.year),
                '{{ month }}': form_widget(form.month),
                '{{ day }}':  '',
                })|raw }}
            </div>
        </div>
    {% endif %}
{% endspaceless %}
{% endblock date_widget %}

<h2>Select a date</h2>
{{ form(form) }}

参考文献:

答案 4 :(得分:0)

我没有使用下拉列表,但在single_text中使用bootstrap-datetimepicker。对于我来说,在数据库中的单独字段中保存月份和年份会很困难,因为我按此日期排序。所以我决定永远保存所选月份的第一天。我使用DatetimepickerBundle,我的自定义表单类型如下:

class MonthPickerType extends AbstractType
{
    public function configureOptions(OptionsResolver $resolver)
    {
        $resolver->setDefaults(array(
            'pickerOptions' => array(
                'autoclose' => true,
                'format' => 'mm/yyyy',
                'startView' => 'year',
                'minView' => 'year',
            )
        ));
    }

    public function getParent()
    {
        return 'collot_datetime';
    }

    public function getName()
    {
        return 'month_picker';
    }
}

结果:

enter image description here