ext4 itemselector的使用

实现的效果如下：

1.准备工作，itemselector是extjs核心以外的插件，因此要把外部的js文件和css样式导入，注意的问题是js文件和css文件的路径。

代码如下：

<link rel="stylesheet" type="text/css" href="ux/css/ItemSelector.css" />
<script type="text/javascript" src="ux/form/ItemSelector.js"></script>
<script type="text/javascript" src="ux/form/MultiSelect.js"></script>

2.准备数据store。这里只是简单的示例，所以store只是简单的数据。

代码：

var store=Ext.create('Ext.data.ArrayStore',{
	data:[['1','one'],['2','two'],['3','three'],['4','four']],
	fields:[
		{name:'value',type:'string'},
		{name:'text',type:'string'}
		]
	});	

3.创建form和itemselector。

代码：

var form =new Ext.FormPanel({
	url : 'xxxx.do',
	renderTo : 'form',//html里边一div的id
	frame : true,
	title : '表单',
	width : 500,
	x:300,
	items : [
		{
			xtype:'fieldset',//相当于给itemselector的外边家里一个壳子
			title:'sel',
			autoHeight:true,
			items:[{
				xtype : 'itemselector',
				name:'sel',
				width : 162,
				height : 240,
				store :store, //提前准备好的store数据
				anchor: '100%',
				fromTitle: '待选择',
				toTitle: '已选择',
				allowBlank: true
			}]
		}
	]
	});