datetimepicker

datetime picker input widget
21 followers

datetime picker input widget, based on Jui-timepicker-addon

Requirements

Yii framework with Zii lib.

Usage

extract to extensions folder.

put next code into view:

<?php Yii::import('application.extensions.CJuiDateTimePicker.CJuiDateTimePicker');
    $this->widget('CJuiDateTimePicker',array(
        'model'=>$news, //Model object
        'attribute'=>'eventDate', //attribute name
                'mode'=>'datetime' //use "time","date" or "datetime" (default)
        'options'=>array() // jquery plugin options
    ));
?>

Resources

Total 12 comments

#7712 report it
Patrigan at 2012/04/11 05:29am
Re: #7233

I've found a simple, but not so pretty workaround to the language issue.

<?php Yii::import('application.extensions.CJuiDateTimePicker.CJuiDateTimePicker');
            $this->widget('CJuiDateTimePicker',array(
                'model'=>$model, //Model object
                'attribute'=>'start', //attribute name
                'mode'=>'datetime', //use "time","date" or "datetime" (default)
                'options'=>array("dateFormat"=>'yy/mm/dd'), // jquery plugin options
                'language' => ''
            ));
        ?>

This should show English text and a DateTime formatted as: "2012/04/11 12:00"

#7688 report it
seb7 at 2012/04/09 06:50pm
translation js

You need 2 modifications to add a translation : in jquery-ui-timepicker-addon.js , function Timepicker() 1-Add the translation like

this.regional['fr'] = {
        currentText: 'Maintenant',
        closeText: 'Ok',
        ampm: false,
        timeFormat: 'hh:mm tt',
        timeOnlyTitle: 'Choisir heure',
        timeText: 'Horaire',
        hourText: 'Heure',
        minuteText: 'Minute',
        secondText: 'Seconde',
        timezoneText: 'Time Zone'
    };

then register it at the end of the function :

$.extend(this._defaults, this.regional['fr']);
#7285 report it
tigo at 2012/03/10 04:46am
Спасибо

Спасибо =)

#7233 report it
Head-Crash at 2012/03/06 05:02am
Default to "Chinese Traditional" characters even though regional = "en_us" / time convert is necessary

antonywu´s workaround...

if (isset($this->language) && $this->language != 'en_us'){

...works great and there´s no more need to force english language all the time. Thanks a lot! But the output string differs from original one instead of using default CJuiDateTimePicker settings:

  • old string: yyyy/mm/dd hh:mm
  • new string: mm/dd/yyyy hh:mm

I recommend to convert the string to an unix time stamp because it´s easier to handle. The necessary command should be:

$this->start_time = CDateTimeParser::parse($this->start_time,'MM/dd/yyyy HH:mm');       /
#7080 report it
scoob.junior at 2012/02/22 09:30pm
Internationalization problem

Hi, tks for the extension!

I'm trying to show "hours", "minutes", "seconds" texts in a language different from "en"

I've created the proper array in the js file as

this.regional['pt_br'] = { // pt-br
        currentText: 'Agora',
        closeText: 'Feito',
        ampm: true,
        timeFormat: 'hh:mm:ss tt',
        timeOnlyTitle: 'Escolher horário',
        timeText: 'Horário',
        hourText: 'Horas',
        minuteText: 'Minutos',
        secondText: 'Segundos',
        timezoneText: 'Fuso'
    };

but only the calendar gets translated when I set the widget as

$this->widget('ext.EJuiTimePicker.EJuiTimePicker',
 
                                    array(
                                        'model'=>$model,
                                        'attribute'=>'start_time',
                                        'options' => array(//'changeMonth' => 'true',
                                                            //'changeYear' => 'true',
                                                            //'showButtonPanel' => 'true',
                                                            //'constrainInput' => 'false',
                                                            //'duration'=>'fast',
                                                            //'showAnim' =>'slide',
                        //'showSecond'=>true,
 
                        'language'=>'pt_br'
                    ),
                                        'htmlOptions'=>array()
                                    )
            );

Please, what am I missing to get texts translated?

Thanks and regards!

#5619 report it
KieranA at 2011/10/25 11:44pm
re: #4885

I also dont get the times displaying. Is this something with the new version of Yii or something thats stopping this from working?

#4885 report it
aqge at 2011/08/25 05:04am
i don see the times

how come i dont see the time input, only date exists? i ve seen the original Ui.js istwork but this CJUI didtn

#4809 report it
abioneperhobby at 2011/08/18 09:58am
how to use outside view?

hi,

i want to use this widget outside a view so $this-> don't work.

i'm able to import the widget, but i'm not able to load it.

can you explain me please?

my code

<?php
 
$yii=dirname(__FILE__).'/../../yii/framework/yii.php';
$config=dirname(__FILE__).'/../protected/config/main.php';
require_once($yii);
// remove the following lines when in production mode
defined('YII_DEBUG') or define('YII_DEBUG',true);
// specify how many levels of call stack should be shown in each log message
defined('YII_TRACE_LEVEL') or define('YII_TRACE_LEVEL',3);
 
Yii::setPathOfAlias('estensioni', dirname(__FILE__).'/../protected');
 
Yii::import('estensioni.extensions.CJuiDateTimePicker.CJuiDateTimePicker');
?>

[php] <?php $this->widget('CJuiDateTimePicker',array( 'model'=>Activity::model(), //Model object 'attribute'=>'activity_deadline', //attribute name 'mode'=>'datetime', //use "time","date" or "datetime" (default) 'options'=>array('dateFormat'=>'yy-mm-dd'), // jquery plugin options 'language' => '', )); ?>

i obtain

Fatal error: Using $this when not in object context in /var/www/tasker/task/task-new.php on line 20


#4169 report it
dinhtrung at 2011/06/12 10:22am
The JS is fixed with dateformat + separator + timeformat. How can I change?

In Vietnamese, the date time usually goes with : hh:ii:ss dd/mm/yy. I dive into the js code, and found out that there is no way I could change the order of date and time through configuration.

I use DateTimeI18Behavior to parse the date and time string, and the format ship with Yii is correct, but I cannot make the JQuery plugin to change to this format.

How can I convert the input format to correct output one?

#3808 report it
antonywu at 2011/05/09 09:38am
Different Design Approach

@ianare Well, interesting that you mentioned about the other plugin. Here are some major differences 1. DateTimePicker inherits from Zii's DatePicker, so the implementation only has three files (compared to the TimePicker which has 21 files..) 2. The UI interaction is different. For DateTimePicker, you can click in the field, and the UI would pop up right away. With TimePicker, I would need to click on that "..." button in order to show the UI. 3. Finally, thanks to Zii, DateTimePicker supports far more languages than TimePicker does.

Now, it all comes down to your personal preference. For me, with minor changes (see my earlier post), it works like a charm for me.

#3805 report it
ianare at 2011/05/09 04:12am
dupe ?

What advantage over the existing plugin ?

http://www.yiiframework.com/extension/timepicker

#3775 report it
antonywu at 2011/05/07 09:29am
Default to "Chinese Traditional" characters even though regional = "en_us"

So I noticed something odd with the extension but I highly suspect CJuiDatePicker is also affected. With the default settings, language is default to "en_us" The end result is that it will show DateTimePicker in Chinese characters. On the other hand, if I set language => '' (like below), DateTimePicker displays the language correctly (in English of course)

<?php Yii::import('application.extensions.CJuiDateTimePicker.CJuiDateTimePicker');
    $this->widget('CJuiDateTimePicker',array(
        'model'=>$news, //Model object
        'attribute'=>'eventDate', //attribute name
        'mode'=>'datetime', //use "time","date" or "datetime" (default)
        'options'=>array(), // jquery plugin options
        'language' => ''
    ));
?>

Since I don't want to force English language all the time, I ended up modifying the extension inside run() at line 47. That way, it will display the language correctly, and at the same time, reduce the need to load i8n script.

if (isset($this->language) && $this->language != 'en_us'){
            $this->registerScriptFile($this->i18nScriptFile);
....
}

Leave a comment

Please to leave your comment.

Create extension