`

flex中datagrid添加超链接

    博客分类:
  • Flex
 
阅读更多
想要达到的效果如图中点击datagrid中第二列的任何一个值如“南京”、“杭州”就会触发一个事件,
http://dl.iteye.com/upload/attachment/609708/cae77eec-9c39-3aac-831a-31711fe78c1c.png
在datagrid中可使用 <mx:itemRenderer>
      <fx:Component>
       <mx:LinkButton />
      </fx:Component>
     </mx:itemRenderer>
但是 linkbutton所触发的事件如何才能调用到写在script中的方法呢。

使用outerDocument,就可以调用外部的函数,outerDocument 标识符将作用范围更改为查找文件或外部文档。

代码如下:
<?xml version="1.0" encoding="utf-8"?>
<s:Application xmlns:fx="http://ns.adobe.com/mxml/2009"
   xmlns:s="library://ns.adobe.com/flex/spark"
   xmlns:mx="library://ns.adobe.com/flex/mx" xmlns:supportClasses="com.esri.ags.skins.supportClasses.*" minWidth="955" minHeight="600" creationComplete="init()">
<fx:Script>
<![CDATA[
import mx.collections.ArrayCollection;
import mx.controls.Alert;
import mx.events.FlexEvent;
[Bindable]
private var consProjects:ArrayCollection=new ArrayCollection 

([{name:'杭州',consOrgName:'中铁一局',projectStatus:'在建',tbOrgName:'建筑队4组',projectManager:'李建刚',projectCost:'3876M',buildingArea:'4000万平米'}, 

{name:'南京',consOrgName:'中铁四局',projectStatus:'在建',tbOrgName:'建筑队4组',projectManager:'李建刚',projectCost:'3876M',buildingArea:'4000万平米'}, 

]); 


protected function init(event:FlexEvent = null):void
{

}

public function clickEvent(o:Object):void{ 
Alert.show(o.consOrgName);        
}

]]>
</fx:Script>
<fx:Declarations>
<!-- 将非可视元素(例如服务、值对象)放在此处 -->
</fx:Declarations>
<s:Group width="100%" height="100%">
<s:VGroup width="100%" height="100%">
<s:HGroup width="100%" height="30">
</s:HGroup>
<mx:DataGrid width="100%" dataProvider="{consProjects}">
<mx:columns>
<mx:DataGridColumn headerText="序号" sortable="false" resizable="false" textAlign="center" editable="false" width="40"/>
<mx:DataGridColumn headerText="XXXX" dataField="name">
<mx:itemRenderer> 
<fx:Component>
<mx:LinkButton label="{data.name}" color="red"  textDecoration="none"  click="outerDocument.clickEvent(data)"/>
</fx:Component> 
</mx:itemRenderer> 
</mx:DataGridColumn>
<mx:DataGridColumn headerText="XXXX" dataField="consOrgName"/>
<mx:DataGridColumn headerText="XXXX" dataField="projectStatus"/>
<mx:DataGridColumn headerText="XXXX" dataField="tbOrgName"/>
<mx:DataGridColumn headerText="XXXX" dataField="projectManager"/>
<mx:DataGridColumn headerText="XXXX" dataField="projectCost"/>
<mx:DataGridColumn headerText="XXXX" dataField="buildingArea"/>
</mx:columns>
</mx:DataGrid>
</s:VGroup>
</s:Group>
</s:Application>
  • 大小: 10.9 KB
分享到:
评论

相关推荐

    ASP.NET中DataGrid添加超链接、自定义显示示、页脚汇

    在DataGrid中添加超链接,可以让你的数据行变成可点击的链接,从而提供更直观的导航体验。具体实现方法是在`DataGrid1_ItemDataBound`事件中,利用HTML标签 `&lt;a&gt;` 来创建超链接。例如: ```vb e.Item.Cells(1).Text...

    flex中dataGrid导出数据到excel中

    flex中dataGrid导出数据到excel中,不存在乱码问题

    FLEX的datagrid合计、平均值

    在Flex开发中,Datagrid组件是用于展示数据集的一个强大工具,它允许用户以表格的形式查看和操作数据。本文将深入探讨如何在Flex的Datagrid中实现数据的合计与平均值计算,帮助开发者更好地理解和应用这些功能。 ...

    flex的dataGrid添加复选框(checkBox)

    在实际应用中,我们经常需要在DataGrid的每一行中添加复选框(checkBox),以便用户可以选择一行或多行数据进行操作。这个教程将详细解释如何在Flex的DataGrid中动态添加复选框,并通过一个名为`DataGridDemo`的示例...

    flex 自定义 datagrid 列头带组合框进行过滤

    要在列头中添加ComboBox,首先需要创建一个新的MXML组件,该组件包含一个ComboBox实例。然后,在这个自定义组件中,我们需要监听ComboBox的事件,如`change`事件,当用户在组合框中选择一个值时触发此事件。接着,...

    在flex的dataGrid控件中显示图片的实践

    在Flex中显示图片通常涉及到以下步骤: 1. **数据模型**:首先,我们需要定义一个数据模型,包含用于存储图片二进制数据的字段。在Spring和Hibernate的环境中,这通常是一个Java实体类,例如`ImageEntity`,包含一...

    Flex4 DataGrid控件行编辑项目

    在DataGrid中添加和删除行涉及到数据源的动态操作。添加新行时,需要创建一个新的数据对象,将其添加到数据源,然后DataGrid会自动更新以显示新行。删除行则需要从数据源中移除相应的数据对象,并刷新DataGrid。 五...

    flex datagrid 标题栏添加 checkbox 和 数据行 checkbox 连动

    在Flex中,DataGrid的标题栏是通过HeaderRenderer自定义的。你可以创建一个新的类,继承自MXHeaderRenderer,并在这个类中添加一个CheckBox组件。然后,你需要覆盖`updateDisplayList()`方法,以确保复选框在正确的...

    Flex的DataGrid中使用CheckBox

    Flex的DataGrid中使用CheckBox. 大家共同研究

    Flex4 DataGrid表格操作

    Flex4 DataGrid表格操作,表格回车事件默认是换行,这里修改为换单元格,单元格轮完换行。支持上下左右和回车键控制光标位置,还添加了"+","-"按钮,用于控制添加行和删除选中的行。

    flex datagrid 添加按钮

    在这个场景中,我们需要在DataGrid中添加一个自定义的按钮,并且根据特定的内容来决定这个按钮是否应该被显示。这涉及到Flex组件定制、事件处理以及条件判断等多个知识点。 首先,我们要了解Flex中的DataGrid组件。...

    Flex 自定义Datagrid的ItemRender

    本文将深入探讨如何在Flex中自定义Datagrid的ItemRender,以实现按钮、单选、复选和日期等控件的集成。 首先,我们需要了解ItemRender的基本概念。ItemRenderer是Flex提供的一种机制,允许开发者为数据网格中的每一...

    flex下拉dataGrid

    在Flex中,下拉控件(Dropdown)通常由ComboBox或List控件实现,而数据网格(DataGrid)则用于显示和操作结构化的表格数据。要实现“带dataGrid的自定义下拉控件”,我们需要对这两个组件进行组合和定制,创建一个...

    flex DataGrid 表头分组

    3. **配置`AdvancedDataGrid`组件**:Flex中的`AdvancedDataGrid`相对于基础的`DataGrid`提供了更丰富的功能,包括表头分组。在`AdvancedDataGrid`中,我们需要设置`&lt;mx:columns&gt;`子元素来定义列,并为需要分组的列...

    flex 把datagrid的内容导出到Excel

    Datagrid是Flex中的一个核心组件,用于展示表格数据。它提供了丰富的功能,如排序、分页和自定义列显示。然而,有时用户可能需要将这些数据保存为Excel格式以便进一步分析或分享。这就涉及到了数据导出的功能。 要...

    flex中dataGrid全选和全不选功能

    首先,我们需要了解Flex中的DataGrid是如何工作的。DataGrid组件依赖于数据提供者(dataProvider),通常是一个 ArrayCollection 或者其他的可迭代集合。DataGrid会根据这个数据提供者来动态创建行,并显示其中的...

    Flex中Datagrid应用(每行修改删除按钮)

    在DataGrid的每一行中添加修改和删除按钮,通常需要自定义ItemRenderer。ItemRenderer是DataGrid列中每个单元格的外观和行为定制组件。我们可以通过继承MX的ListBase类或者UIComponent类来创建自定义的ItemRenderer...

    Flex-DataGrid源码及资料

    1. 鼠标右键:在Flex DataGrid中添加鼠标右键菜单,可以为用户提供额外的操作选项。例如,用户可以通过右键点击某一列来执行排序、隐藏或显示列、导出数据等操作。这通常需要自定义事件监听器,并创建一个...

    Flex FooterSpark DataGrid 表格制作

    Flex FooterSpark DataGrid 是Adobe Flex框架中用于创建高级数据展示组件的一个重要工具,它在桌面和Web应用中广泛用于数据网格的展示。Flex是基于ActionScript和MXML的开源框架,用于构建富互联网应用程序(RIA)。...

Global site tag (gtag.js) - Google Analytics