Using CJUIDatePicker in Yii CActiveForm Widget

If you want to add Jquery UI DatePicker in create/update form, you can do the following,
http://jqueryui.com/datepicker/

Inside

<?php
$form=$this->beginWidget('CActiveForm', array(
    'id'=>'event-form',
    'enableAjaxValidation'=>false,
)); ?>

<?php $this->endWidget(); ?>

Find the row you want to add the datepicker,

<div class="row">
 <?php echo $form->labelEx($model,'created'); ?>
 <?php echo $form->textField($model,'created'); ?>
 <?php echo $form->error($model,'created'); ?>
</div>

Replace 

<?php echo $form->textField($model,'created'); ?> 

with

<?php 

$this->widget('zii.widgets.jui.CJuiDatePicker', array(
 'name'=>"Event[created]", // the name of the field
 'value'=>$model->created,  // pre-fill the value
 // additional javascript options for the date picker plugin
 'options'=>array(
 'showAnim'=>'fold',
 'dateFormat'=>'yy-mm-dd',  // optional Date formatting
 'debug'=>true,
),
 'htmlOptions'=>array(
 'style'=>'height:20px;'
 ),
 )); 

?>

That's it!  Unfortunately, it didn't work for me, so I had to update old jquery-ui.css and jquery-ui.js.

To update them, download the latest stable version and upload them to PATH-TO-FRAMEWORK/web/js/source/jui/js / jquery-ui.min.js and jquery-ui-i18n.min.js and /web/js/source/jui/css/base / jquery-ui.css

Yay! It is working~