README

#DatetimepickerBundle

本扩展包实现了 Bootstrap DateTime Picker，并将其应用于 Symfony 3.* 和 ^4.0 版本的表单类型。扩展包的结构灵感来源于 GenemuFormBundle。

演示： http://www.malot.fr/bootstrap-datetimepicker/demo.php

请随意贡献、分支、发送合并请求和创建工单。

##安装

步骤 1：安装 DatetimepickerBundle

将以下依赖项添加到您的 composer.json 文件中

{
    "require": {

        "alexvasilyev/datetimepicker-bundle": "dev-master"
    }
}

然后运行

php composer.phar update stephanecollot/datetimepicker-bundle

步骤 2：启用扩展包

Symfony 3

<?php
// app/AppKernel.php

public function registerBundles()
{
    $bundles = array(
        // ...
        new SC\DatetimepickerBundle\SCDatetimepickerBundle(),
    );
}

Symfony 4

<?php
// config/bundles.php
return [
        // ...
        SC\DatetimepickerBundle\SCDatetimepickerBundle::class => ['all' => true],
];

Symfony 3

# app/config/config.yml
sc_datetimepicker:
    picker: ~

Symfony 4

# config/packages/sc_datetimepicker.yaml
sc_datetimepicker:
    picker: ~

步骤 3：初始化资源

Symfony 3

$ php app/console assets:install web/

Symfony 4

$ php app/console assets:install public/

用法

<?php
// ...
use SC\DatetimepickerBundle\Form\Type\DatetimeType;

public function buildForm(FormBuilder $builder, array $options)
{
    $builder
        // defaut options
        ->add('createdAt', DatetimeType::class)
        
        // full options
        ->add('updatedAt', DatetimeType::class, array( 'pickerOptions' =>
            array('format' => 'mm/dd/yyyy',
                'weekStart' => 0,
                'startDate' => date('m/d/Y'), //example
                'endDate' => '01/01/3000', //example
                'daysOfWeekDisabled' => '0,6', //example
                'autoclose' => false,
                'startView' => 'month',
                'minView' => 'hour',
                'maxView' => 'decade',
                'todayBtn' => false,
                'todayHighlight' => false,
                'keyboardNavigation' => true,
                'language' => 'en',
                'forceParse' => true,
                'minuteStep' => 5,
                'pickerReferer ' => 'default', //deprecated
                'pickerPosition' => 'bottom-right',
                'viewSelect' => 'hour',
                'showMeridian' => false,
                'initialDate' => date('m/d/Y', 1577836800), //example
                ))) ; 

}

添加 form_javascript 和 form_stylesheet

原理是将 JavaScript、样式表和 HTML 分离。这有助于更好地整合网页。

示例

{% block stylesheets %}
    <link href="{{ asset('css/bootstrap.min.css') }}" rel="stylesheet" />
    
    {{ form_stylesheet(form) }}
{% endblock %}

{% block javascripts %}
    <script src="{{ asset('js/jquery.min.js') }}"></script>
    <script src="{{ asset('js/bootstrap.min.js') }}"></script>
    
    {{ form_javascript(form) }}
{% endblock %}

{% block body %}
    <form action="{{ path('my_route_form') }}" type="post" {{ form_enctype(form) }}>
        {{ form_widget(form) }}

        <input type="submit" />
    </form>
{% endblock %}

文档

datetime picker 的文档在此： http://www.malot.fr/bootstrap-datetimepicker/#options

注意

从 php 'pickerOptions' => array('format'=>'dd MM yyyy - HH:ii p') 中的日期格式用于自动设置 Symfony 的日期格式，以便与 JavaScript 输出兼容。但是，有一些问题，例如，使用 php MM 时，PHP intl 翻译显示 "décembre"，而 Bootstrap 翻译显示 "Decembre"。这就是为什么我编辑了 js/locales/bootstrap-datetimepicker.fr.js 的原因。