属性表格：Ext.grid.PropertyGrid

1、Ext.grid.PropertyGrid
      主要配置项：
            customEditors：自定义编辑器。内置编辑器有string、date、number、boolean
            source：表格要显示的数据对象
  
      主要方法：
            getSource()：取得数据源对象
            setSource( Object source )：设置数据源对象，数据源格式如下：
                  grid.setSource({
                        "(name)": "My Object",
                        "Created": new Date(Date.parse('10/15/2006')),
                        "Available": false,
                        "Version": .01,
                        "Description": "A test object"
                  });

 

 

2、范例源码

var grid = new Ext.grid.PropertyGrid({
	title: "PropertyGrid实例",
	width: 300,
	height: 300,
	frame: true,
	source: {
		"员工名称": "张三",
		"出生日期": new Date(1978, 01, 02),
		"性别": "男",
		"是否已婚": true,
		"年龄": 31
	},
	customEditors: {
		"性别": new Ext.grid.GridEditor(new Ext.form.ComboBox({
			editable: false,
			displayField: "sex",
			mode: "local",
			triggerAction: "all",
			store: new Ext.data.SimpleStore({
				fields: ["sex"],
				data: [["男"], ["女"]]
			})
		})),
		
		//内置的日期编辑器有bug，自定义日期字段的编辑器可解决
		"出生日期": new Ext.grid.GridEditor(new Ext.form.DateField({
			format: "Y年m月d日",
			selectOnFocus: true,
			allowBlank: false
		}))
	}
});

//内置的日期字段格式是”m/j/Y“，如果需要改变默认格式则要通过取得表格的列模式来实现
grid.getColumnModel().dateFormat = "Y年m月d日";

grid.render("div1");