EJuiDateTimePicker is an extension of CJuiDatePicker. It extends the datepicker with the possibility to also set the time. Time is set using two sliders. The extension uses the datetimepicker addon developed by Trent Richardson.
Requirements ¶
Yii 1.1.4 or above
Installation ¶
Unpack the code in protected/extensions
Usage ¶
<?php
$this->widget('application.extensions.timepicker.EJuiDateTimePicker',array(
'model'=>$model,
'attribute'=>'calev_start',
'options'=>array(
'hourGrid' => 4,
'hourMin' => 9,
'hourMax' => 17,
'timeFormat' => 'h:m',
'changeMonth' => true,
'changeYear' => false,
),
));
?>
Versions ¶
- 1.0 2010-11-12 - Initial release
- 1.1 2010-11-20 - Various small changes as requested
- 1.2 2010-11-24 - Various small changes as requested
callbacks
Once again posting about callbacks. @mbetel thank for link. But there is some problem I cannot go around. Lets have this code:
$this->widget('zii.widgets.jui.CJuiDatePicker', array( 'model'=>$model, 'attribute'=>'to', 'options'=>array( // some options... 'beforeShow'=>'function(){ // some code }', ) ));
As you can see, I got my callback function form of string. This wrong, cos it leads to JS code, where callback is also in form of string.
~~~
[javascript]
jQuery('#selector').datepicker({ /some options/, 'beforeShow'=>'function(){}' });
~~~
What I need, is direct definition of callback function.
~~~
[javascript]
jQuery('#selector').datepicker({ /some options/, 'beforeShow'=>function(){} });
~~~
But I canno figure how to write this on PHP side. Direct writing of function definition leads in syntax error on PHP side.
Any ideas?
@srigi
2 srigi:
Add
js:
before function not to convert it into option. And see CJavaScript.encode() source & docs.$this->widget('zii.widgets.jui.CJuiDatePicker', array( 'model'=>$model, 'attribute'=>'to', 'options'=>array( // some options... 'beforeShow'=>'js:function(){ // some code }', ) ));
If you want to set format see additional options in official addon site:
http://trentrichardson.com/examples/timepicker/
'showAnim'=>'fold', 'showOn'=>'button', 'buttonImage'=>$this->module->shared.'/img/calendar20.png', 'dateFormat'=>'yy-mm-dd', 'timeFormat'=>'hh:mm', 'showHour'=>false, 'showMinute'=>false, 'hour'=>date('H'), 'minute'=>date('i'),
RE: save / update : Mysql db
It works. Sorry I forgot to add rules for the field date in my model object.
array('date', 'required'),
Now, its perfect, this extension Rulez ;)
Nice nice Nice
This one is a nice extension...
Works well
The date/time picker works well. Glad you chose to extend the existing DatePicker. Chose this extension over the other timepicker ext for that reason.
Cheers
Widget factory
Hi,
registerCssFile and registerScriptFile should be in the condition if we plan to use CWidgetFactory:
public function init() { parent::init(); // Register the extension script and needed Css - different $baseUrl from the zii stuff $path = pathinfo(__FILE__); // changed to enable various extension Paths - GOsha $basePath = $path['dirname']. '/assets'; $baseUrl=Yii::app()->getAssetManager()->publish($basePath); $cs=Yii::app()->getClientScript(); if($this->cssFile) $cs->registerCssFile($baseUrl.'/'.$this->extraCssFile); // NOTE CJuiWidget registers the ui js at POS_END so we should too, otherwise the inclusion order is wrong if($this->scriptFile) $cs->registerScriptFile($baseUrl.'/'.$this->extraScriptFile, CClientScript::POS_END); }
Awesome plugin
Thanks a lot for the plugin.
I spent some time for customizing, and now, in a short time, I have a very powerful functionality.
If somebody tries to find the way, how to display date and time format according to locale, here is how I made it:
in the view:
$this->widget('application.extensions.timepicker.EJuiDateTimePicker',array( 'model'=>$model, 'attribute'=>'STARTDATE', 'options'=>array( 'hourGrid' => 6, 'minuteGrid' => 15, 'dateFormat'=>Yii::app()->params['dateformat_map'][Yii::app()->locale->dateFormat], 'timeFormat'=>Yii::app()->params['dateformat_map'][Yii::app()->locale->timeFormat], 'ampm' => ( strpos(Yii::app()->locale->timeFormat, 'a') === false ? false : true ) ) ))
and in config/main.php:
return array( ................. // application-level parameters that can be accessed // using Yii::app()->params['paramName'] 'params' => array( // map of Yii::app()->locale->dateFormat and js datepicker dateformat 'dateformat_map' => array( 'MMM d, y' => 'M d, yy', // locale en date 'h:mm:ss a' => 'h:mm:ss TT', // locale en time 'dd.MM.yyyy' => 'dd.mm.yy', // locale ru date 'H:mm:ss' => 'h:mm:ss' // locale ru time ) ), ................. );
Thank you
This extension made my day.
Flat option
Seems that "flat" option doesn't work here
great tool
wow nice tool, i'm playing with it for a while.. pretty good :)
hours only, minutes only, only the timepart, many variations
anyone want help uv to help!
great job
you may need to install some css
http://jqueryui.com/download
jerome nicholas
programmer/analyst
http://shalomsoftware.com.au
2 x EJuiDateTimePicker , go from one to the other
Hi
I have 2 EJuiDateTimePicker in a form start and end dates
they both work fine
I only have an issue when I go directly from one to the other, the 2nd doesn't open
when I click done that works well or outside the input as well
but from input 1 to input 2 , wont work
has anybody else had this ?
is there a solution ?
or is it just my use case ?
Flat option works. But there is a problem with the time when using it.
I can confirm that the flat option works. I'm using it.
$this->widget('EJuiDateTimePicker',array( 'model'=>$model, 'attribute'=>'tsDebut', 'mode'=>'datetime', 'flat'=>true, 'options'=>array( 'timeFormat'=>'hh:mm:ss', 'dateFormat'=>'yy-mm-dd' ) ));
But there is a problem when using the flat option. When you're not using it, the widget takes his data from the form field when you click in the field. When the flat option is used, the widget have to be set with either default values (current date and time) or by giving a value to the attribute.
The widget sets the date with no problem, but the time is still set at the current time, and not at the ont set in the attribute value.
Why ? Because the extension don't use the attribute value to set the time.
Here is what you see, starting at line 84 :
//set now time.. $this->options['hour'] = date('H'); $this->options['minute'] = date('i'); $this->options['second'] = date('s');
Here is the change I made so the widget can use the time set in the attribute :
//set now time.. $attribute = $this->attribute; if($this->model->$attribute==NULL){ $this->options['hour'] = date('H'); $this->options['minute'] = date('i'); $this->options['second'] = date('s'); }else{ $this->options['hour'] = date('H',strtotime($this->model->$attribute)); $this->options['minute'] = date('i',strtotime($this->model->$attribute)); $this->options['second'] = date('s',strtotime($this->model->$attribute)); }
This is probably not the better version of this, but it works.
AM/PM Option
If you want AM/PM option instead of 24hours, just put the option "ampm" like this example:
$this->widget('application.extensions.timepicker.EJuiDateTimePicker',array( 'model'=>$model, 'attribute'=>'BEGIN_TIME', 'language' => 'pt-BR', 'options'=>array( 'showAnim'=>'slide', 'showSecond'=>true, 'ampm'=>true, 'timeFormat' => 'hh.mm.ss.000000 tt', 'dateFormat'=>'dd-M-y', 'changeMonth' => true, 'changeYear' => true, ), ));
If you have any questions, please ask in the forum instead.
Signup or Login in order to comment.