Для себя писал. Решил выложить, может кому-то пригодится.
Bootstrap datepicker виджет для фильтров в CGridView.
https://github.com/madmis/yii-widgets/t ... DatePicker
Datepicker Виджет Для Cgridview
Re: Datepicker Виджет Для Cgridview
хорошая вещь, хотя конечно для фильтра больше диапазон дат подходит, типа того http://www.dangrossman.info/2012/08/20/ ... bootstrap/
Re: Datepicker Виджет Для Cgridview
Согласен. Просто пока мне понадобился только такой вариант.
Но думаю, можно без проблем сделать и рекомендуемый.
Возможно попробую сделать и такой виджет, если будет время.
Спасибо за наводку.
Но думаю, можно без проблем сделать и рекомендуемый.
Возможно попробую сделать и такой виджет, если будет время.
Спасибо за наводку.
Re: Datepicker Виджет Для Cgridview
Зачем делать заново, если есть YiiBooster? Помогите им лучше допилить баги, если есть время.
-
lancecoder
- Сообщения: 2532
- Зарегистрирован: 2012.06.26, 17:16
Re: Datepicker Виджет Для Cgridview
lol))) только сегодня делал, из бутстрапа любимоненавистного слепил, уж как получилось, но он и правда сыроват, там пока value='' у скрытых полей, пока нет времени с ним заниматься, и планирую от него отказаться, просто я его сначала влепил в форму, а потом уже не хотелось плодить новые расширения и стал его же выпиливать в грид
p.s. критика не принимается 
знаю что криво, и не люблю я переменные заводить во вьюхе, а его пнуть просто так не получится, он келбек теряет, а вот на счет опций я хз, вроде наименования дней, языки не сбивается ничего. И с id я заморочился ибо 2 формы в manage action одна в хеадере таблицы, а одна activeForm 
Код: Выделить всё
<?php
$drpOptions=array();
$drpCallback='function(start, end){
$("#registration_time_min_grid").val(start.toString("yyyy-MM-dd")+" 00:00:00");
$("#registration_time_max_grid").val(end.toString("yyyy-MM-dd")+" 23:59:59");
$("#registration_time_grid").trigger("change");
}';
?>
<?php $this->widget('bootstrap.widgets.TbGridView', array(
/* censored */
'afterAjaxUpdate' => 'js:function (id, data) {
$("#registration_time_grid").daterangepicker('.CJavaScript::encode($drpOptions).', '.$drpCallback.');
}',
'columns'=>array(
/* censored */
'registration_time'=>array(
'name'=>'registration_time',
'filter'=>CHtml::activeHiddenField($model, 'registration_time_min', array('id'=>'registration_time_min_grid', 'value'=>'')).CHtml::activeHiddenField($model, 'registration_time_max', array('id'=>'registration_time_max_grid', 'value'=>'')).
$this->widget('bootstrap.widgets.TbDateRangePicker', array(
'model' => $model,
'attribute' => 'registration_time',
'callback' => new CJavaScriptExpression($drpCallback),
'options' => $drpOptions,
'htmlOptions'=>array('id'=>'registration_time_grid'),
),true),
),
/* censored */
),
));
Re: Datepicker Виджет Для Cgridview
Замучался я с TbDateRangePicker, но он завёлся.
Единственное:
Как отправить данные с фильтров не нажимая enter?
-
flashimage
- Сообщения: 1517
- Зарегистрирован: 2011.01.23, 12:43
Re: Datepicker Виджет Для Cgridview
Код: Выделить всё
$('.items [name|="Document[date]"]').live('focus',function(){
$(this).daterangepicker(
{
ranges: {
'Сегодня': ['today', 'today'],
'Вчера': ['yesterday', 'yesterday'],
'Последние 7 дней': [Date.today().add({ days: -6 }), 'today'],
'Последние 30 дней': [Date.today().add({ days: -29 }), 'today'],
'Текущий месяц': [Date.today().moveToFirstDayOfMonth(), Date.today().moveToLastDayOfMonth()],
'Последний месяц': [Date.today().moveToFirstDayOfMonth().add({ months: -1 }), Date.today().moveToFirstDayOfMonth().add({ days: -1 })]
},
format:('dd.MM.yyyy'),
language:'ru'
},
function(start, end) {
var e = $.Event("change");
$('[name|="Document[date]"]').trigger(e);
}
);
});Бранчи это гомеоморфические эндофункторы, которые мапятся на субманифолды пространства Гилберта.
Re: Datepicker Виджет Для Cgridview
Спасибо, всё получилось.
Если кому пригодится:
Ну и в конце представления нужно реализовать 'afterAjaxUpdate' => 'reinstallDatePicker', просто скопировав сгенерированный код при первой загрузки страницы:
Если кому пригодится:
Код: Выделить всё
$this->widget(
'bootstrap.widgets.TbGridView',
array(
'dataProvider' => $model->search(),
'filter' => $model,
'afterAjaxUpdate' => 'reinstallDatePicker',
'columns' => array(
array(
'name' => 'date',
'value' => '$data->date',
'filter' => $this->widget(
'bootstrap.widgets.TbDateRangePicker',
array(
'model' => $model,
'attribute' => 'date',
'options' => array(
'locale' => array(
'applyLabel' => 'Применить фильтр',
'clearLabel' => 'Очистить',
'fromLabel' => 'От',
'toLabel' => 'До',
'customRangeLabel' => 'Свой диапазон',
),
'format' => 'YYYY-MM-DD',
'ranges' => array(
'За сегодня' => array('js: moment().subtract(\'days\', 0), moment().subtract(\'days\', 0)'),
'За вчера' => array('js: moment().subtract(\'days\', 1), moment().subtract(\'days\', 1)'),
'За эту неделю' => array('js: moment().startOf(\'week\'), moment().endOf(\'week\')'),
'За этот месяц' => array('js: moment().startOf(\'month\'), moment().endOf(\'month\')'),
'За текущий год' => array('js: moment().startOf(\'year\'), moment().endOf(\'year\')'),
),
),
'callback' => 'js: function(start, end) {
var e = $.Event("change");
$(\'[name|="Request[date]"]\').trigger(e);
} ',
'htmlOptions' => array(
'autocomplete' => 'off',
)
),
true
),
),
),
)
);Код: Выделить всё
Yii::app()->clientScript->registerScriptFile(Yii::app()->theme->getBaseUrl() . '/js/moment.min.js');
Yii::app()->clientScript->registerScript(
're-install-date-picker',
<<<'EOD'
function reinstallDatePicker(id, data) {
$("#Request_date").daterangepicker(
{'locale':{'applyLabel':'Применить фильтр','clearLabel':'Очистить','fromLabel':'От','toLabel':'До','customRangeLabel':'Свой диапазон','daysOfWeek':['В','П','В','С','Ч','П','С'],'monthNames':['Январь','Февраль','Март','Апрель','Май','Июнь','Июль','Август','Сентябрь','Октябрь','Ноябрь','Декабрь']},'format':'YYYY-MM-DD','ranges':{'За сегодня':[ moment().subtract('days', 0), moment().subtract('days', 0)],'За вчера':[ moment().subtract('days', 1), moment().subtract('days', 1)],'За эту неделю':[ moment().startOf('week'), moment().endOf('week')],'За этот месяц':[ moment().startOf('month'), moment().endOf('month')],'За текущий год':[ moment().startOf('year'), moment().endOf('year')]}}, function(start, end) {
var e = $.Event("change");
$('[name|="Request[date]"]').trigger(e);
} );
}
EOD
); Re: Datepicker Виджет Для Cgridview
1. Sozdal extended klass, gde sozdajotsa js init funkcia, kotorju potom mozjna vizvatjs v afterAjaxUpdate.
2. Primer. Nado toljaka postavitj pravoljnuju imja funkcii v afterAjaxUpdate
Код: Выделить всё
class TbFilterDateRangePicker extends TbDateRangePicker {
/**
* ### .init()
*
* Initializes the widget.
*/
public function init() {
//htmloptions
$this->htmlOptions = array(
'size' => 20,
'class' => 'date20',
'title' => Yii::t('TbFilterDateRangePicker', 'Date from-to'));
//callbach triger change input field
list($name, $id) = $this->resolveNameID();
$callback = 'function(start, end){
$("#' . $id . '" ).trigger("change");
}';
$this->callback = new CJavaScriptExpression($callback);
parent::init();
//options
$this->options = array(
'showButtonPanel' => true,
'changeYear' => true,
'format' => 'YYYY-MM-DD',
'ranges' => array(
Yii::t('TbFilterDateRangePicker', 'Today') => array(
new CJavaScriptExpression('moment()'),
new CJavaScriptExpression('moment()')
),
Yii::t('TbFilterDateRangePicker', 'Yesterday') => array(
new CJavaScriptExpression("moment().subtract('days', 1)"),
new CJavaScriptExpression("moment().subtract('days', 1)")
),
Yii::t('TbFilterDateRangePicker', 'Last 7 Days') => array(
new CJavaScriptExpression("moment().subtract('days', 6)"),
new CJavaScriptExpression("moment()")
),
Yii::t('TbFilterDateRangePicker', 'Last 30 Days') => array(
new CJavaScriptExpression("moment().subtract('days', 29)"),
new CJavaScriptExpression("moment()")
),
Yii::t('TbFilterDateRangePicker', 'This Month') => array(
new CJavaScriptExpression("moment().startOf('month')"),
new CJavaScriptExpression("moment().endOf('month')"),
),
Yii::t('TbFilterDateRangePicker', 'Last Month') => array(
new CJavaScriptExpression("moment().subtract('month', 1).startOf('month')"),
new CJavaScriptExpression("moment().subtract('month', 1).endOf('month')"),
),
),
'locale' => array(
'applyLabel' => Yii::t('TbFilterDateRangePicker', 'Applay'),
'clearLabel' => Yii::t('TbFilterDateRangePicker', 'Clear'),
'fromLabel' => Yii::t('TbFilterDateRangePicker', 'From'),
'toLabel' => Yii::t('TbFilterDateRangePicker', 'To'),
'customRangeLabel' => Yii::t('TbFilterDateRangePicker', 'Custom range'),
),
);
}
/**
* ### .run()
*
* Runs the widget.
*/
public function run() {
if ($this->selector) {
$this->registerDateRangePlugin($this->selector, $this->options, $this->callback);
} else {
list($name, $id) = $this->resolveNameID();
if ($this->hasModel()) {
if ($this->form) {
echo $this->form->textField($this->model, $this->attribute, $this->htmlOptions);
} else {
echo CHtml::activeTextField($this->model, $this->attribute, $this->htmlOptions);
}
} else {
echo CHtml::textField($name, $this->value, $this->htmlOptions);
}
$this->setLocaleSettings();
$this->registerDateRangePlugin('#' . $id, $this->options, $this->callback);
}
}
/**
* Registers the Bootstrap daterange plugin
* create function and call of this function
*
* @param string $selector the CSS selector
* @param array $options the plugin options
* @param string $callback the javascript callback function
*
* @see http://www.dangrossman.info/2012/08/20/a-date-range-picker-for-twitter-bootstrap/
* @since 1.1.0
* @deprecated 3.0.0
*/
public function registerDateRangePlugin($selector, $options = array(), $callback = null) {
list($name, $id) = $this->resolveNameID();
Yii::app()->clientScript->registerScript(
$id, 'function filter_' . $id . '_init(){
$("' . $selector . '").daterangepicker(' . CJavaScript::encode($options) . ($callback ? ', ' . CJavaScript::encode($callback) : '') . ');
}
filter_' . $id . '_init();'
);
}
/**
* ### .setLocaleSettings()
*
* If user did not provided the names of weekdays and months in $this->options['locale']
* (which he should not care about anyway)
* then we populate this names from Yii's locales database.
*
* This method works with the local properties directly, beware.
*/
private function setLocaleSettings() {
$this->setDaysOfWeekNames();
$this->setMonthNames();
}
/**
* ### .setDaysOfWeekNames()
*/
private function setDaysOfWeekNames() {
if (empty($this->options['locale']['daysOfWeek'])) {
$this->options['locale']['daysOfWeek'] = Yii::app()->locale->getWeekDayNames('narrow', true);
}
}
/**
* ### .setMonthNames()
*/
private function setMonthNames() {
if (empty($this->options['locale']['monthNames'])) {
$this->options['locale']['monthNames'] = array_values(
Yii::app()->locale->getMonthNames('wide', true)
);
}
}
}
Код: Выделить всё
$this->widget('TbExtendedGridView', array(
'type'=>'bordered condensed',
'id' => 'bfrf-fuel-refill-grid',
'fixedHeader' => true,
'headerOffset' => 40,
'dataProvider' => $model->search(),
'filter' => $model,
'template' => '{items}{summary}{pager}',
'rowCssClassExpression' => '$data->cssclass',
'pager' => array(
'class' => 'TbPager',
'displayFirstAndLast' => true,
),
'afterAjaxUpdate' => 'filter_RememberBfrfFuelRefill_bcbd_date_range_init',
'columns' => array(
array(
'header' => Yii::t('FuelingModule.crud', 'Date'),
'name' => 'bcbd_date',
'value' => 'CHtml::value($data, \'bfrfBcbd.bcbd_date\')',
'filter' => $this->widget('application.widgets.TbFilterDateRangePicker',
array(
'model' => $model,
'attribute' => 'bcbd_date_range',
), TRUE ),
),
Re: Datepicker Виджет Для Cgridview
А как Вам такой вариант?
http://www.yiiframework.com/wiki/345/ho ... atepicker/
Мне понравился. Быстро, просто и доступно ) ?
http://www.yiiframework.com/wiki/345/ho ... atepicker/
Мне понравился. Быстро, просто и доступно ) ?