关于My97DatePicker日期插件wdatepicker datefmt及常用功能的理解

wdatepicker datefmt

前端页面:

            <tr>

                <tb>出生日期:</tb>

                <tb><input id="d11" type="text" name="birthday" onFocus="WdatePicker({dateFmt:'yyyy-MM-dd HH:mm:ss' , isShowClear:false,readOnly:true , onpicked:function(){this.blur();} })" datatype="date"/></tb>

            </tr>

后台实体类:

@Entity

@Table(name="teacher")

@Setter

@Getter

public class Teacher extends JPABaseEntity {

    @Column(name="uname")

    private String uname ;

    @Column(name="phonnumber")

    private String phonNumber ;

    @Column(name="password")

    private String password ;

    @Column(name="email")

    private String email ;

    @DateTimeFormat(pattern="yyyy-MM-dd HH:mm:ss")

    @Temporal(TemporalType.DATE)

    @Column(name="birthday")

    private Date birthday ;

}

 @DateTimeFormat(pattern="yyyy-MM-dd HH:mm:ss"):这是将日期类型转换为"yyyy-MM-dd HH:mm:ss"这种形式;

注意前端这句话dateFmt:'yyyy-MM-dd HH:mm:ss',这是将前端My97DatePicker插件转换为相应格式,此处为'yyyy-MM-dd HH:mm:ss',这样保证了前后端日期格式相对应,传值不会报错;

前端错误格式:

             <tr>

                <tb>出生日期:</tb>

                <tb><input id="d11" type="text" name="birthday" onFocus="WdatePicker({ isShowClear:false,readOnly:true , onpicked:function(){this.blur();} })" datatype="date"/></tb>

            </tr>

缺少了dateFmt:'yyyy-MM-dd HH:mm:ss'这句话,My97DatePicker插件的默认转换格式为“yyyy-MM-dd ”,

导致前后端日期格式不对应,会报出“相关参数格式错误”;

isShowWeek

可以通过配置isShowWeek属性决定是否限制周,并且在返回日期的时候还可以通过自带的自定义事件和API函数返回选择的周

<input id="d121" type="text" onfocus="WdatePicker({isShowWeek:true})"/>

操作按钮自定义

清空按钮和今天按钮,可以根据需要进行自定义,它们分别对应 isShowClear 和 isShowToday 默认值都是true

  禁用清空功能:

  最好把readOnly置为true,否则即使隐藏了清空按钮,用户依然可以在输入框里把值delete掉

自定义格式

yMdHmswW分别代表年月日时分秒星期周,可以任意组合这些元素来自定义你个性化的日期格式.

取得系统可识别的日期值:

类似于 1999年7月5日 这样的日期是不能够被系统识别的,他必须转换为能够识别的类型如 1999-07-05 

2016年12月12日 真实的日期值是: 2016-12-12  

<input id="d244" type="text" class="Wdate" onfocus="WdatePicker({dateFmt:'yyyy年M月d日',vel:'d244_2'})"/>

<input id="d244_2" type="text" />

注意:在实际应用中,一般会把vel指定为一个hidden控件,这里是为了把真实值展示出来,所以使用文本框

关键属性: vel 指定一个控件或控件的ID,必须具有value属性(如input),用于存储真实值(也就是realDateFmt和realTimeFmt格式化后的值)

猜你喜欢

转载自mr-lee11.iteye.com/blog/2342414