flex + spring + BlazeDS + google App JDO 实现一个CRUD.

flex + spring + BlazeDS + google App JDO 实现一个CRUD.

 

分页在上一个 博客讲了

 

如何做一个分页.现在要在这个分页上面在做一个CURUD.

 

列表页面

 

 form页面.表单.

 删除页面,可以删除单个和多个.

查询页面.支持分页查询.

 

最重要的是分页列表里面.删除一个后.要刷新数据.

调用.outerDocument.removeOne([data.id.toString()]);

 

用 flex 做的ajax 效果不错. 代码写的也很少.很方便的维护.

 

SystemUserList.mxml

 

<?xml version="1.0" encoding="utf-8"?>
<mx:Module xmlns:mx="http://www.adobe.com/2006/mxml"
  backgroundColor="#EEEEEE" width="100%" fontSize="12" initialize="initApp();" height="100%"
  xmlns:common="common.page.*">
  
<mx:RemoteObject id="systemUserService" destination="systemUserService">
	<mx:method name="remove" result="removeHandler(event)"/>
	<mx:method name="list" result="listHandler(event)"/>
	<mx:method name="listSize" result="listSizeHandler(event)"/>
</mx:RemoteObject>
<mx:Script>
	<![CDATA[
		import systemUser.model.SystemUser;
		import mx.events.CloseEvent;
		import common.event.DataGridDeleteEvent;
		import common.event.DataGridEditEvent;
		import common.event.DataGridCheckBoxEvent;
		import mx.collections.ArrayCollection;
		import mx.events.ItemClickEvent;
		import mx.rpc.events.ResultEvent;
		import common.page.PageConf;
		import mx.controls.Alert;
		import mx.managers.PopUpManager;
		//列表显示数据.
		[Bindable]
      	private var listData:ArrayCollection;
		private var myPageConf:PageConf;
		//初始化函数.
		private function initApp():void{
			//定义一个默认加载类.
	        myPageConf = new PageConf(0,15,0);
	        //第一次默认查询数据.
	        systemUserService.listSize(getCommonPage());
	        //给通用分页Bar绑定事件.
	        commonPageBar.pageLikBar.addEventListener(ItemClickEvent.ITEM_CLICK,
        		function(event:ItemClickEvent):void{//匿名函数.
	        		myPageConf.pageItemClick(event, commonPageBar.pageInfo);
	        		systemUserService.listSize(getCommonPage());
	        });
		}
		//通用查询,返回Map参数.
		private function getCommonPage():Object{
			var objMap:Object = new Object();
			if(loginName_search.text != ""){objMap["loginName,=="] = loginName_search.text;}
			if(passwd_search.text != ""){objMap["passwd,=="] = passwd_search.text;}
			if(name_search.text != ""){objMap["name,=="] = name_search.text;}
			if(phone_search.text != ""){objMap["phone,=="] = phone_search.text;}
			if(email_search.text != ""){objMap["email,=="] = email_search.text;}
			return objMap;
		}
		//新建Form弹出窗口.
		public function addForm(id:String):void
		{
			var addForm:SystemUserForm = new SystemUserForm();
	        if(id != null){
		        addForm.formId = id;//将id赋值,查询交给form.
	        }
	        //添加保存事件响应,保存后刷新数据.
	        addForm.addEventListener("saveSystemUser",
	        	function(event:Event):void{//匿名函数.
	        		systemUserService.listSize(getCommonPage());
	        });
			PopUpManager.addPopUp(addForm, this, true);
			PopUpManager.centerPopUp(addForm);
		}
		//删除单个记录.
		public function removeOne(ids:Array):void
		{
			Alert.show("是否确认删除?", "提示", 3, this, 
				function(event:CloseEvent):void{//匿名函数.
					if (event.detail == Alert.YES){
						systemUserService.remove(ids);
					}
	        });
		}
		//删除多个记录.
		public function removeAll():void
		{
			Alert.show("是否确认删除?", "提示", 3, this, 
				function(event:CloseEvent):void{//匿名函数.
					if (event.detail == Alert.YES){
						var ids:Array = new Array();
						for each(var data:Object in dataGrid.selectedItems){
							ids.push(data.id);
						}
						if(ids.length == 0){
							Alert.show("请选择数据,按住shift或ctrl进行选择.","提示");
						}else{
							systemUserService.remove(ids);
						}
					}
	        });
		}
		
		/*****下面是回调函数.*****/
		//查询总数.回调函数.
		private function listSizeHandler(event:ResultEvent):void
		{
			var pageSize:Number = event.result as Number;
			myPageConf.total = pageSize;
			systemUserService.list(myPageConf.getStart(), myPageConf.getEnd(),getCommonPage());
			//查询出总记录数时.显示信息.
			myPageConf.showPageInfo(commonPageBar.pageInfo);
		}
		//查询数据.回调函数.
		private function listHandler(event:ResultEvent):void
		{
			 listData = event.result as ArrayCollection;
		}
		//删除方法.回调函数.
		public function removeHandler(event:ResultEvent):void
		{
			if(event.result.toString() == "true"){
				Alert.show("删除成功!","提示");
				systemUserService.listSize(getCommonPage());
			}else{
				Alert.show("删除失败!","提示");
			}
		}
	]]>
</mx:Script>
<!--//列表开始.-->
<mx:VBox>
	<mx:HBox width="100%">
		<mx:Label text="登录名"/><mx:TextInput id="loginName_search" width="80"/>
		<mx:Label text="密码"/><mx:TextInput id="passwd_search" width="80"/>
		<mx:Label text="姓名"/><mx:TextInput id="name_search" width="80"/>
		<mx:Label text="电话"/><mx:TextInput id="phone_search" width="80"/>
		<mx:Label text="email"/><mx:TextInput id="email_search" width="80"/>
		<mx:Button label="查询" click="systemUserService.listSize(getCommonPage());"/>
	</mx:HBox>
	<mx:DataGrid width="100%" height="420" id="dataGrid" allowMultipleSelection="true"
		editable="false" dataProvider="{listData}">
	    <mx:columns>
	        <mx:DataGridColumn headerText="登录名" dataField="loginName"/>
	        <mx:DataGridColumn headerText="密码" dataField="passwd"/>
	        <mx:DataGridColumn headerText="姓名" dataField="name"/>
	        <mx:DataGridColumn headerText="电话" dataField="phone"/>
	        <mx:DataGridColumn headerText="email" dataField="email"/>
			<mx:DataGridColumn width="85"><mx:itemRenderer><mx:Component>
				<mx:HBox width="100%" height="100%">
				<mx:LinkBar height="22" itemClick="itemClick(event);">
					<mx:dataProvider><mx:Array>
								<mx:String>修改</mx:String>
								<mx:String>删除</mx:String>
					</mx:Array></mx:dataProvider>
				</mx:LinkBar>
				<mx:Script>
					<![CDATA[
						import mx.events.CloseEvent;
						import mx.controls.Alert;
						import mx.events.ItemClickEvent;
						private function itemClick(itemClick:ItemClickEvent):void{
							if(itemClick.index == 0){
								outerDocument.addForm(data.id.toString());
							}else if(itemClick.index == 1){//删除单个数据.
								outerDocument.removeOne([data.id.toString()]);
							}
						}
					]]>
				</mx:Script>
				</mx:HBox>
			</mx:Component></mx:itemRenderer></mx:DataGridColumn>
	    </mx:columns>
	</mx:DataGrid>
	<mx:HBox width="100%">
		<mx:Button label="新增" click="addForm(null);"/>
		<mx:Button label="删除" click="removeAll();"/>
		<mx:Spacer width="100"/>
        <common:PageBar id="commonPageBar"/>
	</mx:HBox>
</mx:VBox>
</mx:Module>

 

SystemUserForm.mxml

 

<?xml version="1.0" encoding="utf-8"?>
<mx:TitleWindow xmlns:mx="http://www.adobe.com/2006/mxml" 
    title="SystemUser表单" initialize="initApp();"
    backgroundColor="#EEEEEE" showCloseButton="true"
    close="PopUpManager.removePopUp(this);"
	borderColor="#869CA7" fontSize="12">
<mx:Style>
.errorTip{fontSize: 12;}
</mx:Style>
<mx:RemoteObject id="systemUserService" destination="systemUserService">
	<mx:method name="findById" result="findByIdHandler(event)"/>
	<mx:method name="save" result="saveHandler(event)"/>
</mx:RemoteObject>
    <mx:Script>
        <![CDATA[
        	import mx.validators.Validator;
        	import mx.controls.Alert;
        	import systemUser.model.SystemUser;
        	import mx.rpc.events.ResultEvent;
            import mx.managers.PopUpManager;
            
            public var isValid:Boolean = false;//
            public var formId:String = null;//保存ID主键.
            //初始化函数.
			private function initApp():void{
				if(formId != null){//如果formId存在,查询.
			        systemUserService.findById(formId);
		        }
			}
			//查询响应处理.
			private function findByIdHandler(event:ResultEvent):void
			{
				var mySystemUser:SystemUser = event.result as SystemUser;
				setFormData(mySystemUser);
			}
			//保存函数.
            private function save():void {
            	var myValid:Array = Validator.validateAll([//校验表单.
            		loginName_valid,
            		passwd_valid,
            		name_valid,
            		phone_valid,
            		email_valid,
            		createDate_valid,
            		islock_valid,
            		loginTimes_valid,
            		lastLogin_valid
            	]);
            	if(myValid.length == 0){
	            	var mySystemUser:SystemUser = new SystemUser();
					mySystemUser.loginName = loginName_id.text;
					mySystemUser.passwd = passwd_id.text;
					mySystemUser.name = name_id.text;
					mySystemUser.phone = phone_id.text;
					mySystemUser.email = email_id.text;
					mySystemUser.createDate = createDate_id.text;
					mySystemUser.islock = islock_id.text;
					mySystemUser.loginTimes = loginTimes_id.text;
					mySystemUser.lastLogin = lastLogin_id.text;
					if(formId != null){//如果formId不为null.将值保存.
	            		mySystemUser.id = formId;
	            	}
	                systemUserService.save(mySystemUser);
             	}
            }
            //保存后,关闭.
            private function saveHandler(event:ResultEvent):void {
            	dispatchEvent(new Event("saveSystemUser"));
                PopUpManager.removePopUp(this);
            }
            //当编辑的时候,设置form.
            public function setFormData(mySystemUser:SystemUser):void {
				loginName_id.text = mySystemUser.loginName;
				passwd_id.text = mySystemUser.passwd;
				name_id.text = mySystemUser.name;
				phone_id.text = mySystemUser.phone;
				email_id.text = mySystemUser.email;
				createDate_id.text = mySystemUser.createDate;
				islock_id.text = mySystemUser.islock;
				loginTimes_id.text = mySystemUser.loginTimes;
				lastLogin_id.text = mySystemUser.lastLogin;
            }
        ]]>
    </mx:Script>
	<!--//校验开始.-->
	<mx:StringValidator id="loginName_valid" source="{loginName_id}" property="text"/>
	<mx:StringValidator id="passwd_valid" source="{passwd_id}" property="text"/>
	<mx:StringValidator id="name_valid" source="{name_id}" property="text"/>
	<mx:StringValidator id="phone_valid" source="{phone_id}" property="text"/>
	<mx:StringValidator id="email_valid" source="{email_id}" property="text"/>
	<mx:StringValidator id="createDate_valid" source="{createDate_id}" property="text"/>
	<mx:StringValidator id="islock_valid" source="{islock_id}" property="text"/>
	<mx:StringValidator id="loginTimes_valid" source="{loginTimes_id}" property="text"/>
	<mx:StringValidator id="lastLogin_valid" source="{lastLogin_id}" property="text"/>
	
	<!--//表单开始.-->
	<mx:Form id="creditCardForm">
		<mx:FormItem label="登录名"><mx:TextInput id="loginName_id"/></mx:FormItem>
		<mx:FormItem label="密码"><mx:TextInput id="passwd_id"/></mx:FormItem>
		<mx:FormItem label="姓名"><mx:TextInput id="name_id"/></mx:FormItem>
		<mx:FormItem label="电话"><mx:TextInput id="phone_id"/></mx:FormItem>
		<mx:FormItem label="email"><mx:TextInput id="email_id"/></mx:FormItem>
		<mx:FormItem label="创建时间"><mx:TextInput id="createDate_id"/></mx:FormItem>
		<mx:FormItem label="是否锁定"><mx:TextInput id="islock_id"/></mx:FormItem>
		<mx:FormItem label="登录次数"><mx:TextInput id="loginTimes_id"/></mx:FormItem>
		<mx:FormItem label="上次登录时间"><mx:TextInput id="lastLogin_id"/></mx:FormItem>
		<mx:FormItem><mx:HBox>
		        <mx:Button click="save();" label="保存"/>
		        <mx:Button click="PopUpManager.removePopUp(this);" label="关闭"/>
		</mx:HBox></mx:FormItem>
	</mx:Form>
</mx:TitleWindow>  

 

附件是全部代码.

功能上面.排序还是没有实现服务端排序.还就是Grid 默认的客户端排序.

其他CRUD 的基本功能都完成了.

 

部署到服务器上面地址

 

http://myflexeye.appspot.com/

 

可以用这个做点小东西了.

下面研究下.拖拽.

 

 

评论

1 楼 zhang_jie 2010-11-29  

你好：
我想问一下为什么我module只能加载一次