calendar控件使用 extjs_ExtJs定制日历控件——自动加载更新(日历控件显示)

将定制的日历控件放到一个Panel里显示，其结构如下：

, {

border: true,

id: 'page',

animCollapse : true,

width: 1050,

height: 560,

style: 'margin-left: 10;',

checkboxToggle: true,

layout: 'column',

items: [{

xtype: 'panel',

layout: 'form',

border: false,

width: 1050,

height: 560

}]

}

在某个事件处理中，写上如下代码就会自动在id='page'的Panel里自动加载了。

自动加载的代码：

var x = Ext.getCmp('page').items.get(0); // 找到放日历控件的面板部分

Ext.getCmp('page').remove(x,true); // 将日历控件移除(移除掉再加载，才会将更新部分加载上，如果不需要的话，可以不用前两行代码)

myDate = new Ext.MyDatePicker(); // 创建一个新日历控件

Ext.getCmp('page').add(myDate); // 将日历控件加到Panel里

Ext.getCmp('page').doLayout(true); // 并显示