Chinaunix首页 | 论坛 | 博客
  • 博客访问: 843106
  • 博文数量: 190
  • 博客积分: 2991
  • 博客等级: 少校
  • 技术积分: 2400
  • 用 户 组: 普通用户
  • 注册时间: 2012-09-24 18:11
文章分类

全部博文(190)

文章存档

2015年(3)

2014年(1)

2013年(65)

2012年(121)

我的朋友

分类: 系统运维

2012-11-02 13:26:02

我们的表单中经常需要用户输入时间,yii中有很方便的时间控件CJuiDatePicker可供使用,得到的效果如下:


调用方法
  1.     $this->widget('zii.widgets.jui.CJuiDatePicker',array(  
  2.                         'language'=>'zh_cn',  
  3.             'name'=>'worktime[start]',  
  4.             'value'=>$query['start'] ? $query['start'] : Date('Y-m-d'),  
  5.             'options'=>array(  
  6.                         'showAnim'=>'fold'
  7.                         'showOn'=>'both',  
  8.                         'buttonImage'=>Yii::app()->request->baseUrl.'/images/calendar.gif',  
  9.                                     'maxDate'=>'new Date()',  
  10.                         'buttonImageOnly'=>true,  
  11.                         'dateFormat'=>'yy-mm-dd',  
  12.             ),  
  13.             'htmlOptions'=>array(  
  14.                         'style'=>'height:18px',  
  15.                         'maxlength'=>8,  
  16.             ),  
  17.     ));  
  18. ?>  
上述代码得到的html代码如下:
  1. <input type="text" name="worktime[start]" value="2012-11-02" id="worktime_start" maxlength="8" style="height:18px" class="hasDatepicker">  
  2. <img class="ui-datepicker-trigger" src="/oss/images/calendar.gif" alt="..." title="...">  
CJuiDatePicker中的参数说明
name:input标签中的name
value: input标签中的value
options:主要是日历控件显示相关的
      showAnim:日历框出现的动画效果,可选值slideDown, show(the default), slideDown, fadeIn, fold 等
      showOn:日历框如何被触发,both:点图标和输入框均可;focus:点输入框;button:点图标
      buttonImage:图标图片地址
      maxDate:可选的最大日期,对应的还有minData
      dateFormat:日历数据格式。注意,上面value的日期格式必须与此处一致,否则数据不会与控件匹配。
htmlOptions:input框的一些html设置,如样式,最大长度等。
源文地址:
阅读(1142) | 评论(0) | 转发(0) |
给主人留下些什么吧!~~