但是有一个问题就是在更新的时候都是发送整个datagrid的dataprovider中信息到数据库,无论有的资料并没有需要更新,这样处理起来效率就很低了。所在在高级篇中我想传递的数据只是用户更新的那部分。这样效率就会明显提高了。
首先还是来看后台处理:这次我们除了原有的更新数据的功能,我们将增加删除功能【用户通过delete键删除datagrid中行】。我们的数据传输格式还是json.所以在后台读取的部分保持不变,数据格式更前面的一样,主要是修改更新那部分:
public String sendJsonArray(String jsonData){
String result= new String();
//jsonData = jsonData.replace("\\", "");
JSONArray jsonArray = JSONArray.fromObject(jsonData);
System.out.println(jsonArray.toString());
try{
Connection conToDb = conToDB();
Statement stmt = conToDb.createStatement();
for(int i=0;i<jsonArray.size();i++){
JSONObject jsonObject = JSONObject.fromObject(jsonArray.getString(i));
String operation = jsonObject.getString("operation");
if(operation.equals("update")){
String name = jsonObject.getString("name");
String id = jsonObject.getString("id");
stmt.executeUpdate("update employee set name='"+name+"' where id='"+id+"'");
result="恭喜,成功更新"+name+"数据!";
System.out.println(result);
}else if(operation.equals("delete")){
String id = jsonObject.getString("id");
stmt.executeUpdate("delete from employee where id = '"+id+"'");
result="恭喜,成功删除"+id+"数据!";
}
//String name = jsonObject.getString("name");
//stmt.executeUpdate("update employee set name='"+name+"' where id='"+id+"'");
}
conToDb.close();
}catch(Exception e){
result = e.getLocalizedMessage();
}
return result;
}
我们传递过来的数据经过json解码之后的格式如下:
[{"operation":"delete","id":"MS009"},{"operation":"update","id":"MS008","name":"Luciya6"}]
有一个operation选项:这个决定是执行更新还是删除操作,更新就包括id,name了。如果是删除就只有id这个数据。至于数据库操作起来就很简单了。看代码就可以了。操作成功我们有一个返回值:“恭喜,成功更新Luciya6数据!”返回给Flex界面。
接下来解析前台的处理。前台的界面设计还是跟前面的一样,不过增加了一个组件checkbox:用于提供自动更新功能【用户无需手动点击更新按钮】。
<mx:CheckBox id="chkAutoUpdate" x="391" y="268" label="Auto"/>
原先我们的做法是在dataProvider上直接赋值,那么这次我们就需要另外顶一个类似dataProvider类型的[ArrayCollection]的数组了,这里叫做dataToUpdate;所以在初始化中增加:
private function initDataGrid():void{
dataArray = new ArrayCollection();
dataToUpdate = new ArrayCollection;//用来保存用户更新部分数据
getData.getOperation('getJsonArray').send();
}
同时呢,我们开始监听dataProvider中书的数据dataArray的修改的动作。
private function getJsonData(event:ResultEvent):void{
var rawArray:Array;
var arraySize:int;
var rawData:String = event.result as String;
rawArray = JSON.decode(rawData) as Array;
dataArray = new ArrayCollection(rawArray);
arraySize = dataArray.length;
lblStatus.text="读取成功,总共"+arraySize+"条员工信息";
dataArray.addEventListener(CollectionEvent.COLLECTION_CHANGE,dataChanged);//监听操作
}
接下来我们定义dataChanged方法:
该方法主要是用来监听修改操作,一旦用户在datagrid中修改数据,就会触发 CollectionEvent.COLLECTION_CHANGE事件,然后根据事件的类型,这里只考虑update类型,如果是update类型执 行记录用户更新的部分资料,然后保存到dataToUpdate数组中:
private function dataChanged(event:CollectionEvent):void{
var item:Object;
var updatedObj:Object;
var i:int;
if(event.kind == CollectionEventKind.UPDATE){
for(i=0;i < event.items.length;i++){
updatedObj = new Object;
updatedObj.operation = "update"
updatedObj.id = dgData.selectedItem.id;//get the id
updatedObj.name =dgData.selectedItem.name;//name
dataToUpdate.addItem(updatedObj);//push it into array
}
这里我们处理完了更新部分,接下来处理键盘的delte事件,首先在dataGrid中添加keyUp事件处理:
<mx:DataGrid id="dgData" toolTip="姓名可编辑" x="10" y="10" width="436" height="250" dataProvider="{dataArray}"
creationComplete="{initDataGrid()}" editable="true" itemEditEnd="{checkName(event)}" verticalScrollPolicy="on"
keyUp="checkKeyPress(event)">
然后具体定义checkKeyPress()事件:
private function checkKeyPress(event:KeyboardEvent):void{
if(event.keyCode == Keyboard.DELETE){
var data:ArrayCollection = dgData.dataProvider as ArrayCollection;
if(dgData.selectedIndex>=0 && dgData.selectedIndex<data.length){
//save the data before removed
var updatedObj:Object = new Object;
updatedObj.operation = "delete";
updatedObj.id = dgData.selectedItem.id;
dataToUpdate.addItem(updatedObj);
data.removeItemAt(dgData.selectedIndex);
}
}
}
同样把要删除的那行数据先保存到要更新的数组中,然后执行removeItemAt()方法移除那行。这样所有要更新或者要删除的数据都保存在了 dataToUpate数组中。当然我们分别定义了operation的内容,后台程序也会更具operation的内容执行具体的操作。最后是发送数据 给后台程序:我们使用的是remoteObject方法,这里不继续讲了【参考签两篇文章】,给出代码:
private function sendDataAction():void{
var dataString:String;
var objSend:Object = new Object();
if(dataToUpdate.length==0){
lblStatus.text="没有数据改动...!";
}else{
dataString = JSON.encode(dataToUpdate.toArray());
sendData.sendJsonArray(dataString);
//clear the dataArray for new operation
dataToUpdate.removeAll();
lblStatus.text="正在更新,请稍候...";
}
}
很简单,把ArrayCollection转化为Array,然后用json的encode方式转化成json格式传输。后台处理也只要更具getString(property)方式拿到对应的值就可以了,参考前面给出的java代码。
效果图: