flex之鸡肋功能——双击编辑列内容

flex中的DataGrid是支持单击编辑单元格内容的，不过这确实不够方便，单击是选中数据的，怎么能变成修改呢！在网上查了看，利用一个DataGrid组件，可以实现双击修改
此组件源码为：
DoubleClickDataGrid.as

package {import flash.events.MouseEvent;import mx.controls.DataGrid;import mx.controls.dataGridClasses.DataGridColumn;import mx.controls.listClasses.IDropInListItemRenderer;import mx.controls.listClasses.IListItemRenderer;import mx.core.EventPriority;import mx.events.DataGridEvent;

/**  *  DataGrid that only allows editing if you double click */public class DoubleClickDataGrid extends DataGrid{

   public function DoubleClickDataGrid() {     super();      doubleClickEnabled = true;   }

   override protected function mouseDoubleClickHandler(event:MouseEvent):void    {        var dataGridEvent:DataGridEvent;        var r:IListItemRenderer;     var dgColumn:DataGridColumn;

        r = mouseEventToItemRenderer(event);     if (r && r != itemEditorInstance)        {         var dilr:IDropInListItemRenderer = IDropInListItemRenderer(r);           if (columns[dilr.listData.columnIndex].editable)          {             dgColumn = columns[dilr.listData.columnIndex];                dataGridEvent = new DataGridEvent(DataGridEvent.ITEM_EDIT_BEGINNING, false, true);                // ITEM_EDIT events are cancelable                dataGridEvent.columnIndex = dilr.listData.columnIndex;                dataGridEvent.dataField = dgColumn.dataField;                dataGridEvent.rowIndex = dilr.listData.rowIndex + verticalScrollPosition;                dataGridEvent.itemRenderer = r;                dispatchEvent(dataGridEvent);            }        }

       super.mouseDoubleClickHandler(event); }

   override protected function mouseUpHandler(event:MouseEvent):void {        var r:IListItemRenderer;       var dgColumn:DataGridColumn;

        r = mouseEventToItemRenderer(event);     if (r)        {         var dilr:IDropInListItemRenderer = IDropInListItemRenderer(r);           if (columns[dilr.listData.columnIndex].editable)          {             dgColumn = columns[dilr.listData.columnIndex];               dgColumn.editable = false;           }     }

       super.mouseUpHandler(event);

        if (dgColumn)         dgColumn.editable = true;

  }}}

响应事件是itemEditEnd时，不知道怎么得到处理完的对象。只能处理一个字段修改：
//双击修改处理1
private function itemedit(e:DataGridEvent):void
{

var obj:ListTestVO = ListTestVO(e.itemRenderer.data);//获得修改之前的对象
var oldname:String = e.itemRenderer.data.name;//获得修改之前对象的名字
obj.name = e.currentTarget.itemEditorInstance.text;//把修改后的值附给obj
if(oldname!=obj.name){
listTestSvc.update(obj);
}
}

用itemFocusOut事件，倒可以轻松获取修改后的对象，不过不知道如何验证....
//双击修改处理2
private function itemedit(e:DataGridEvent):void
{
var obj:ListTestVO = ListTestVO(e.itemRenderer.data);//获得修改之后的对象
listTestSvc.update(obj);
dg.addEventListener(DataGridEvent.ITEM_EDIT_END,itemedit);
dg.removeEventListener(DataGridEvent.ITEM_EDIT_BEGINNING,itemedit);
}

还有出现一个问题，修改后，你切换一下页面，在你默认选中的列，会变成可修改的状态...

[img]/upload/attachment/86921/0e5e2511-4ab9-3634-b23a-b5f4b8e8f6cc.jpg[/img]

至今也没弄清楚哪儿的问题....哎，真是鸡肋功能啊！

值得参考的资料：
Flex中获得DataGrid中编辑前后的数据
[url]http://liguoliang.com/2008/10/256/[/url]

flex之鸡肋功能——双击编辑列内容相关推荐

ooalv自定义按钮、单击、双击、列编辑切换的事件用法
1.需新建屏幕1001 并画container:'CONT1' 2.需新建屏幕1002 并画container:'CONT2' 3.定义屏幕1001.1002的ok_code和逻辑流 4.定义工具栏 ...
html table 筛选记录,JS实现table表格内针对某列内容进行即时搜索筛选功能
JS实现table表格内针对某列内容进行即时搜索筛选功能发布时间:2020-08-29 09:26:37 来源:脚本之家阅读:103 作者:Marx-link 本文实例讲述了JS实现table表格 ...
JS单击/双击编辑功能
JS单击/双击编辑功能 HTML <!DOCTYPE html> <html lang="en"> <head><meta charset ...
给GridView编辑列按钮添加客户端提示信息
看到题目是不是觉得有点老掉牙啊?这个好像是在asp.net 1.1时代就有人开始研究的东西,怎么现在还在拿出来说啊?是有点老套,写在这里纯粹只是为了做个笔记,为以后提供点方便. 在使用GridView ...
那些年微信开发过的鸡肋功能，及其带给我们的思考
本文由作者"卫夕"(ID:weixizhibei)原创,作者为资深广告产品经理,致力于剖析互联网广告的基本逻辑.思路及技巧. 1.引言坐拥7亿日活的微信极其成功,有人说微信的成功 ...
怎么在pdf上编辑文字内容
pdf文件是我们办公中很常见的一种文件格式,我们有时候会需要修改pdf文件里的内容,但并不是所有的小伙伴都知道应该如何修改.所以,今天给大家带来了几个pdf编辑文字内容的方法,小伙伴们可以根据自己的喜 ...
html中两列合并,表格怎么把两列内容合并到一起
1. 怎么将EXCEL表格中两列的内容合并成一列而内容不变将EXCEL表格中两列的内容合并成一列而内容不变,可以使用合并功能函数"&"实现. 方法步骤如下: 1.打开需要 ...
html双击变成可编辑,jquery 实现双击编辑并保存
jquery 实现双击编辑并保存 Jesse 2013-12-11 19:47:00 1153 最近在做一个数据修改的例子,一个个点开修改很麻烦,于是就想到ecshop后台里的只需单击就以编辑了,在 ...
第12章[12.2] Ext JS可编辑列Grid的全场景开发
基本功能描述与实现在Grid中,对一列或某几列批量编辑.编辑效果如下图: 功能实现的思路如下: 可编辑的列使用 widgetcolumn 类型.调用Grid的reconfigure()方法,重新生成 ...

flex之鸡肋功能——双击编辑列内容

flex之鸡肋功能——双击编辑列内容相关推荐

最新文章

热门文章