Skip to content
Date Range Picker widget for Yii2
Branch: master
Clone or download
Latest commit ab6a86a Mar 1, 2019
Permalink
Type Name Latest commit message Commit time
Failed to load latest commit information.
config Moved config to root dir Mar 1, 2019
docs/readme Added Usage May 16, 2018
src Moved config to root dir Mar 1, 2019
tests Removed unused use May 18, 2018
.gitignore inited May 5, 2018
.php_cs csfixed May 15, 2018
.scrutinizer.yml inited May 5, 2018
.travis.yml inited May 5, 2018
LICENSE docs May 5, 2018
README.md minor May 16, 2018
composer.json Moved config to root dir Mar 1, 2019
hidev.yml docs May 15, 2018
phpunit.xml.dist minor Mar 1, 2019

README.md

Yii2 Date Range Picker

Date Range Picker widget for Yii2

Latest Stable Version Total Downloads Build Status Scrutinizer Code Coverage Scrutinizer Code Quality Dependency Status

This widget renders a DateRangePicker input control using Bootstrap Date Range Picker widget.

Installation

The preferred way to install this yii2-extension is through composer.

Either run

php composer.phar require "hiqdev/yii2-daterangepicker"

or add

"hiqdev/yii2-daterangepicker": "*"

to the require section of your composer.json.

Usage

There are two ways of using this widget: with an ActiveForm instance or as a widget setting up its model and attribute. Additional options could be passed in 'clientOptions' array.

With an ActiveForm

<?php
use hipanel\widgets\DatePicker;
...
$this->pickerOptions = ArrayHelper::merge([
    'class' => DateRangePicker::class,
    'name' => '',
    'options' => [
        'tag' => false,
        'id' => "{$id}-period-btn",
    ],
    'clientEvents' => [
        'apply.daterangepicker' => new JsExpression(/** @lang JavaScript */"
            function (event, picker) {
                var form = $(picker.element[0]).closest('form');
                var span = form.find('#{$id}-period-btn span');

                span.text(picker.startDate.format('ll') + ' - ' + picker.endDate.format('ll'));

                form.find('input[name=from]').val(picker.startDate.format());
                form.find('input[name=till]').val(picker.endDate.format());
                form.trigger('change.updateChart');
            }
        "),
        'cancel.daterangepicker' => new JsExpression(/** @lang JavaScript */"
            function (event, picker) {
                var form = $(event.element[0]).closest('form');
                var span = form.find('#{$id}-period-btn span');

                span.text(span.data('prompt'));

                form.find('input[name=from]').val('');
                form.find('input[name=till]').val('');
                form.trigger('change.updateChart');
            }
        "),
    ],
    'clientOptions' => [
        'ranges' => [
            Yii::t('hipanel', 'Current Month') => new JsExpression('[moment().startOf("month"), new Date()]'),
            Yii::t('hipanel', 'Previous Month') => new JsExpression('[moment().subtract(1, "month").startOf("month"), moment().subtract(1, "month").endOf("month")]'),
            Yii::t('hipanel', 'Last 3 months') => new JsExpression('[moment().subtract(3, "month").startOf("month"), new Date()]'),
            Yii::t('hipanel', 'Last year') => new JsExpression('[moment().subtract(1, "year").startOf("year"), new Date()]'),
        ],
    ],
], $this->pickerOptions);
...
?>

As a widget

<?php
use hipanel\widgets\DatePicker;
?>

<?= DateRangePicker::widget([
    'model' => $search->model,
    'attribute' => 'create_from',
    'attribute2' => 'create_till',
    'options' => [
        'class' => 'form-control',
    ],
    'dateFormat' => 'yyyy-MM-dd',
]) ?>

License

This project is released under the terms of the BSD-3-Clause license. Read more here.

Copyright © 2018, HiQDev (http://hiqdev.com/)

Acknowledgments

This package is based on omnilight/yii2-bootstrap-daterangepicker.

You can’t perform that action at this time.