Extjs学习笔记之三 extjs form更多的表单项

具体：http://www.verydemo.com/demo_c101_i32273.html

1.日期选择框，DateField
日期选择框在日常项目中被广泛应用，一个方便的日期输入机制能够极大的提高用户体验。Extjs的DateField非常友好灵活强大。可以通过如下代码新建一个日期选择框：
代码如下:
new Ext.form.DateField({
id: 'diliveryDate',
format: 'Y年m月d日',
maxValue: new Date(),
minValue: '1900-01-01',
disabledDays: [0, 6],
disabledDaysText: '禁止选择该日期',
fieldLabel: '选择日期',
width:200,
showToday:false
})

效果如下：

注意，默认情况下，这个日历显示的是英文，如果需要显示中文，需要引入区域文件：
<script type="text/javascript" src="ext-3.1.0/src/locale/ext-lang-zh_CN.js"></script>对其他控件应该也是类似的。2.HTML编辑器,HTMLEditor
HTML编辑器可以使客户编辑html文档。启用HTML编辑器非常简单，而且几乎不需要额外的配置，默认的就很好用：
代码如下:
new Ext.form.HtmlEditor({
id:'HtmlContent',
autoHeight:false,
width:500,
fieldLabel:'HTML编辑'
})


遗憾的是这个编辑器不支持图文混排，不过对于轻量级的应用来说还是很好用的。如果需要图文混排还是使用专门的第三方的插件好了。

3.组合框, ComboBox
这是一个重量级的控件，因为它在实际应用中起着广泛而重要的作用。虽然它的使用频率没有TextField高，但是它的功能却比TestField丰富的多，所以把它放在比较靠后的位置来介绍。Extjs的ComboBox具有下拉提示，自动完成等功能，也同时支持本地和服务器端的数据源。下面先看一个本地数据源的示例。

本地数据源可以放在一个ArrayStore中，这是一个类似一个数组的结构。例如，可以定义下面的store:
代码如下:
var store = new Ext.data.ArrayStore({
fields: ['Name', 'Code'],
data: [['开发部', 1], ['行政部', 2], ['销售部', 3], ['质检部', 4], ['售后部', 5]]
});下面就可以添加一个combobox，var myform = new Ext.FormPanel({
applyTo: 'myform',
title: 'ComboxBox with local datasource',
height: 200…………………………………………………………………………