<script type="text/javascript">    	
    	Ext.define('Order',{
    		extend:'Ext.data.Model',
    		fields:[
    			{name:"orderID",type:"int"},
    			"customerID","customerName",
    			"employeeID","employeeName",
    			{name:"orderDate",type:"date"},
    			{name:"requiredDate",type:"date"},
    			{name:"shippedDate",type:"date"},
    			"shipVia","companyName",
    			{name:"freight",type:"float"},
    			"shipName","shipAddress","shipCity","shipRegion","shipPostalCode",
    			"shipCountry"
    		],
    		idProperty:"orderID"
    	});
    	
    	Ext.define('Customer',{
    		extend:'Ext.data.Model',
    		fields:[
    			"CustomerID","CustomerName","ContactName",
    			"ContactTitle","Address","City","Region",
    			"PostalCode","Country","Phone","Fax"
    		],
    		idProperty:"CustomerID"
    	});
    	
    	Ext.define('Employee',{
    		extend:'Ext.data.Model',
    		fields:[
    			{name:"EmployeeID",type:"int"},
				"EmployeeName","Title","TitleOfCourtesy",
				{name:"BirthDate",type:"date"},
				{name:"HireDate",type:"date"},
				"Address","City","Region","PostalCode","HomePhone",
				"Extension","Photo","Notes",
				{name:"ReportsTo",type:"int"}
    		],
    		idProperty:"EmployeeID"
    	});
    	
    	Ext.define('Shipper',{
    		extend:'Ext.data.Model',
    		fields:[
    			{name:"shipperID",type:"int"},
				"companyName",
				"phone"
    		],
    		idProperty:"shipperID"
    	});
    	
    	Ext.onReady(function(){
    		if(Ext.BLANK_IMAGE_URL.substr(0,4)!="data"){
    			Ext.BLANK_IMAGE_URL="Images/s.gif";
    		}
    		//在此添加Ext JS代码
    		var customerStore = Ext.create("Ext.data.Store",{
    			firstLoad:true,
    			model:"Customer",
    			autoload:true,
    			pageSize :100,
    			proxy : {
    				type : 'ajax',
    				api:{
    					read:"test/GetCustomers"
    				},
    				reader:{
    					type:"json",
    					root:"data",
    					messageProperty:"Msg"
    				}
    			},
    			storeId:"CustomerStore",
    			listeners : {
    				datachanged:function(store,opts){
    					if(this.firstLoad){
    						delete this.firstLoad;
    						var list = [],
    						data = store.data.items,
    						ln = data.length;
    						for(i=0;i<ln;i++){
    							list.push(data[i].data.customerID);
    						}
    						Order.prototype.validations.push({type:"inclusion",field:"customerID",list:list});
    						Ext.getCmp("add").enable();
    					}
    				}
    			}
    		}).load();
    		
    		var employeeStore = Ext.create("Ext.data.Store",{
    			firstLoad:true,
    			model:"Employee",
    			autoload:true,
    			pageSize :100,
    			proxy : {
    				type : 'ajax',
    				api:{
    					read:"test/GetEmployees"
    				},
    				reader:{
    					type:"json",
    					root:"data",
    					messageProperty:"Msg"
    				}
    			},
    			storeId:"EmployeeStore",
    			listeners : {
    				datachanged:function(store,opts){
    					if(this.firstLoad){
    						delete this.firstLoad;
    						var list = [],
    						data = store.data.items,
    						ln = data.length;
    						for(i=0;i<ln;i++){
    							list.push(data[i].data.employeeID);
    						}
    						Order.prototype.validations.push({type:"inclusion",field:"employeeID",list:list});
    						Ext.getCmp("add").enable();
    					}
    				}
    			}
    		}).load();
    		
    		var shipperStore = Ext.create("Ext.data.Store",{
    			firstLoad:true,
    			model:"Shipper",
    			autoload:true,
    			pageSize :100,
    			proxy : {
    				type : 'ajax',
    				api:{
    					read:"test/GetShippers"
    				},
    				reader:{
    					type:"json",
    					root:"data",
    					messageProperty:"Msg"
    				}
    			},
    			storeId:"ShipperStore",
    			listeners : {
    				datachanged:function(store,opts){
    					if(this.firstLoad){
    						delete this.firstLoad;
    						var list = [],
    						data = store.data.items,
    						ln = data.length;
    						for(i=0;i<ln;i++){
    							list.push(data[i].data.shipVia);
    						}
    						Order.prototype.validations.push({type:"inclusion",field:"shipVia",list:list});
    						Ext.getCmp("add").enable();
    					}
    				}
    			}
    		}).load();
    		
    		var orderStore=Ext.create("Ext.data.Store",{
    			model : "Order",
    			pageSize :20,
    			remoteSort:true,
    			remoteFilter:true,
    			autoLoad:true,
    			proxy : {
    				type : 'ajax',
    				api:{
    					read:"test/opOrders?act=read",
    					create:"test/opOrders?act=add",
    					destroy:"test/opOrders?act=del",
    					update:"test/opOrders?act=edit"
    				},
    				reader : {
    					type : 'json',
    					root : 'data',
    					totalProperty: 'total'
    				},
    				writer:{
    					type:"json",
    					encode:true,
    					root:"data",
    					allowSingle:false
    				}
    			},
    			storeId : 'OrdersStore'
    		});
    		
    		var panel = Ext.create("Ext.grid.Panel",{
    			id:"myGrid",
    			renderTo : Ext.getBody(),
    			title : "订单列表",
    			height : 600,
    			width : 1300,
    			store : orderStore,
    			selModel:{selType:"checkboxmodel",checkOnly:true,mode:"MULTI"},
    			plugins:[{ptype:"cellediting",
    				listeners:{
						edit:function(edit,e){
							if(e.field == "customerID"){
    							var customerStore = Ext.StoreManager.lookup("CustomerStore");
    							var rec = customerStore.getRecorder(e.field,e.value);
    							e.record.set("customerName",rec.data.customerName);
    						}
    						if(e.field == "employeeID"){
    							var employeeStore = Ext.StoreManager.lookup("EmployeeStore");
    							var rec = employeeStore.getRecorder(e.field,e.value);
    							e.record.set("employeeName",rec.data.employeeName);
    						}
    						if(e.field == "shipVia"){
    							var shipperStore = Ext.StoreManager.lookup("ShipperStore");
    							var rec = shipperStore.getRecorder(e.field,e.value);
    							e.record.set("companyName",rec.data.companyName);
    						}
						}
					}
				}],    				
				tbar:{
					xtype:"pagingtoolbar",
					store:orderStore,
					items:[
						"|",
						{text:"增加",id:"add",disable:true,
							handler:function(){
								//增加记录的函数
								var grid = this.up("gridpanel");
								var edit = grid.plugins[0];
								var rec = new Order({
									orderID:"0",
    								customerName:"",
    								customerID:"",
    								employeeName:"",
    								employeeID:"",
    								orderDate:new Date(),
    								requiredDate:new Date(),
    								shippedDate:new Date(),
    								shipVia:"",
    								companyName:"",
    								freight:"0.00",
    								shipName:"",
    								shipAddress:"",
    								shipCity:"",
    								shipRegion:"",
    								shipPostalCode:"",
    								shipCountry:""
								});
								edit.cancelEdit();
								grid.store.insert(orderStore.getCount(),rec);
								edit.startEditByPosition({row:orderStore.getCount(),column:3});
							}
						},
						{text:"删除",id:"delete",disable:true,
							handler:function(){
								//删除记录的函数
								var grid=this.up("gridpanel");
								var rs=grid.getSelectionModel().getSelection();
								if(rs.length > 0){							
									var content="确定删除以下客户订单？</br>";
									for(var i=0;ln=rs.length,i<ln;i++){
										content+=rs[i].data.customerName+"<br/>";
									}
									Ext.Msg.confirm("删除记录",content,function(btn){
										if(btn=="yes"){
											this.store.remove(rs);
											this.store.sync();
										}
									},grid);
								}
							}
						},
						{text:"保存",
							handler:function(){
								//修改记录的函数
								this.up("gridpanel").store.sync();
							}
						}
					]
				},
				columns : [
    				//{xtype:"rownumberer",sortable:false,width:30,align:"center"},
    				{text : "订单编号", dataIndex : 'orderID',width:60,align:"center",
    					renderer:function(v){
    						return Ext.String.leftPad(v,6,"0");
    					}
    				},
    				{text : "客户名称", dataIndex : 'customerID',width:120,sortable:false,flex:1,
    					field:{xtype:"combobox",allowBlank:false,autoRender:true,
    						store:"customerStore",valuefield:"CustomerID",displayField:"CustomerName",
    						forceSelection:true,triggerAction:"all"
    					},
    					renderer:function(v,meta,rec){
    						var store = Ext.StoreManager.lookup("CustomerStore");
    						var rec = store.findRecord("CustomerID",rec.data.customerID);
    						return rec.data.CustomerName;
    					}
    				},
    				{text : "营业员", dataIndex : 'employeeID',width:80,sortable:false,
    					field:{xtype:"combobox",allowBlank:false,autoRender:true,
    						store:"employeeStore",valuefield:"EmployeeID",displayField:"EmployeeName",
    						forceSelection:true,triggerAction:"all"
    					},
    					renderer:function(v,meta,rec){
    						var store = Ext.StoreManager.lookup("EmployeeStore");
    						var rec = store.findRecord("EmployeeID",rec.data.employeeID);
    						return rec.data.EmployeeName;
    					}
    				},
    				{xtype:"datecolumn",text : "订购日期", dataIndex : 'orderDate',width:120,format:"Y年m月d日",editor: 'datefield'},
    				{xtype:"datecolumn",text : "预计到货日期", dataIndex : 'requiredDate',width:120,format:"Y年m月d日",editor: 'datefield'},
    				{xtype:"datecolumn",text : "发货日期", dataIndex : 'shippedDate',width:120,format:"Y年m月d日",editor: 'datefield'},
    				{text : "运货商", dataIndex : 'shipVia',width:80,sortable:false,
    					field:{xtype:"combobox",allowBlank:false,autoRender:true,
    						store:"shipperStore",valuefield:"shipperID",displayField:"companyName",
    						forceSelection:true,triggerAction:"all"
    					},
    					renderer:function(v,meta,rec){
    						var store = Ext.StoreManager.lookup("ShipperStore");
    						var rec = store.findRecord("shipperID",rec.data.shipVia);
    						return rec.data.companyName;
    					}
    				},
    				{xtype:"numbercolumn",text : "运费", dataIndex : 'freight',width:60,format:"￥0.00",editor: 'numberfield'},
    				{text : "收货人", dataIndex : 'shipName',width:60,editor: 'textfield'},
    				{text : "收货地址", dataIndex : 'shipAddress',width:120,editor: 'textfield'},
    				{text : "收货城市", dataIndex : 'shipCity',width:80,editor: 'textfield'},
    				{text : "收货地区", dataIndex : 'shipRegion',width:60,editor: 'textfield'},
    				{text : "邮政编码", dataIndex : 'shipPostalCode',width:90,editor: 'textfield'},
    				{text : "国家", dataIndex : 'shipCountry',width:60,editor: 'textfield'},
    			]
    		});
    	});
    </script>