flex Datagrid checkbox
<?xml version="1.0" encoding="utf-8"?>
<!-- http://blog.flexexamples.com/2008/01/27/using-a-checkbox-control-as-a-list-item-renderer-in-flex/ -->
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml"
xmlns:vo="*"
layout="horizontal"
verticalAlign="middle"
backgroundColor="white"
creationComplete="init();">
<mx:Script>
<![CDATA[
import mx.events.CollectionEvent;
import mx.utils.ObjectUtil;
private function init():void {
arrColl.dispatchEvent(new CollectionEvent(CollectionEvent.COLLECTION_CHANGE));
}
private function arrColl_collectionChange(evt:CollectionEvent):void {
try {
var tArr:Array = arrColl.source.filter(selectedOnly);
textArea.text = ObjectUtil.toString(tArr);
lbl.text = tArr.length.toString() + " item(s) selected";
} catch (err:Error) {
// ignore.
}
}
private function selectedOnly(item:ListItemValueObject, idx:uint, arr:Array):Boolean {
return item.isSelected;
}
]]>
</mx:Script>
<mx:Array id="arr">
<vo:ListItemValueObject label="One" isSelected="true" />
<vo:ListItemValueObject label="Two" isSelected="true" />
<vo:ListItemValueObject label="Three" isSelected="true" />
<vo:ListItemValueObject label="Four" isSelected="true" />
<vo:ListItemValueObject label="Five" isSelected="false" />
<vo:ListItemValueObject label="Six" isSelected="false" />
<vo:ListItemValueObject label="Seven" isSelected="false" />
<vo:ListItemValueObject label="Eight" isSelected="false" />
<vo:ListItemValueObject label="Nine" isSelected="false" />
<vo:ListItemValueObject label="Ten" isSelected="false" />
<vo:ListItemValueObject label="Eleven" isSelected="false" />
<vo:ListItemValueObject label="Twelve" isSelected="false" />
</mx:Array>
<mx:ArrayCollection id="arrColl"
source="{arr}"
collectionChange="arrColl_collectionChange(event);" />
<mx:Panel id="panel"
title="Items"
status="{arrColl.length} total"
styleName="opaquePanel">
<mx:List id="list"
dataProvider="{arrColl}"
alternatingItemColors="[#EEEEEE, white]"
width="150"
rowCount="8">
<mx:itemRenderer>
<mx:Component>
<mx:CheckBox selectedField="isSelected"
change="onChange(event);">
<mx:Script>
<![CDATA[
private function onChange(evt:Event):void {
data.isSelected = !data.isSelected;
}
]]>
</mx:Script>
</mx:CheckBox>
</mx:Component>
</mx:itemRenderer>
</mx:List>
<mx:ControlBar horizontalAlign="right">
<mx:Label id="lbl" />
</mx:ControlBar>
</mx:Panel>
<mx:TextArea id="textArea"
verticalScrollPolicy="on"
width="100%"
height="{panel.height}" />
</mx:Application>
package
{
public class ListItemValueObject
{
[Bindable]
public var label:String;
[Bindable]
public var isSelected:Boolean;
public function ListItemValueObject() {
super();
}
}
}
<?xml version="1.0" encoding="utf-8"?>
<!-- http://blog.flexexamples.com/2008/03/12/using-a-combobox-to-filter-items-in-a-datagrid-in-flex/ -->
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml"
layout="vertical"
verticalAlign="middle"
backgroundColor="white">
<mx:Script>
<![CDATA[
import mx.controls.dataGridClasses.DataGridColumn;
private function toggleFilter():void {
if (checkBox.selected) {
arrColl.filterFunction = processFilter;
} else {
arrColl.filterFunction = null;
}
arrColl.refresh();
}
private function processFilter(item:Object):Boolean {
return parseFloat(item.value) == 0;
}
private function value_labelFunc(item:Object, col:DataGridColumn):String {
return item[col.dataField].toFixed(2);
}
]]>
</mx:Script>
<mx:ArrayCollection id="arrColl">
<mx:source>
<mx:Array>
<mx:Object name="ColdFusion" value="0.00" />
<mx:Object name="Dreamweaver" value="0.12" />
<mx:Object name="Fireworks" value="1.01" />
<mx:Object name="Flash" value="0" />
<mx:Object name="Flash Player" value="-0.00" />
<mx:Object name="Flex" value="0.00" />
<mx:Object name="Illustrator" value="2.92" />
<mx:Object name="Lightroom" value="0.32" />
<mx:Object name="Photoshop" value="0.06" />
</mx:Array>
</mx:source>
</mx:ArrayCollection>
<mx:Panel status="{arrColl.length}/{arrColl.source.length} item(s)">
<mx:DataGrid id="dataGrid"
dataProvider="{arrColl}"
verticalScrollPolicy="on">
<mx:columns>
<mx:DataGridColumn dataField="name" />
<mx:DataGridColumn dataField="value"
labelFunction="value_labelFunc" />
</mx:columns>
</mx:DataGrid>
<mx:ControlBar>
<mx:CheckBox id="checkBox"
label="Filter DataGrid"
click="toggleFilter();" />
</mx:ControlBar>
</mx:Panel>
</mx:Application>
flex Datagrid checkbox的更多相关文章
- flex datagrid checkbox选中项目
<?xml version="1.0" encoding="utf-8"?> <mx:Application xmlns:fx=" ...
- Flex DataGrid可编辑对象实现Enter跳转
来源:http://blog.sina.com.cn/s/blog_5ed17a730100vrja.html 在Flex DataGrid中实现点击Enter键可编辑对象跳转<?xml ver ...
- Flex DataGrid 添加控件
哈喽,又和大家见面了.今天要写的东西是关于Flex DataGrid添加“编辑”或“删除”按钮. 下面是部分代码: <mx:DataGrid id="dgShow" x=&q ...
- easyui datagrid checkbox multiple columns have been done do
lengku1987 2013-01-06 22:27:47 Sponsored Links easyui datagrid checkbox multiple columns have ...
- Flex带Checkbox的Tree
想把Flex自带的Tree控件改成带有checkbox的样式. 原本以为同DataGrid一样,添加一个ItemRenderer就行,结果发现行不通. 进Tree控件的源码看了一下,发现Tree在自己 ...
- jQuery EasyUI DataGrid Checkbox 数据设定与取值
纯粹做个记录,以免日后忘记该怎么设定. 这一篇将会说明两种使用 jQuery EasyUI DataGrid 的 Checkbox 设定方式,以及在既有数据下将 checked 为 true 的该笔数 ...
- EasyUI datagrid checkbox数据设定与取值(转自http://blog.csdn.net/baronyang/article/dnetails/9323463,感谢分享,谢谢)
这一篇将会说明两种使用 jQuery EasyUI DataGrid 的 Checkbox 设定方式,以及在既有数据下将 checked 为 true 的该笔数据列的 Checkbox 设定为 Che ...
- wpf DataGrid CheckBox列全选
最近在wpf项目中遇到当DataGrid的header中的checkbox选中,让该列的checkbox全选问题,为了不让程序员写自己的一堆事件,现写了一个自己的自定义控件 在DataGrid的 &l ...
- EasyUI DataGrid Checkbox 多选 获取选中行中的内容
<table id='grid' class='easyui-datagrid' style='width:950px;height:405px' url='Ajax-index.php?mod ...
随机推荐
- 5 hbase-shell + hbase的java api
本博文的主要内容有 .HBase的单机模式(1节点)安装 .HBase的单机模式(1节点)的启动 .HBase的伪分布模式(1节点)安装 .HBase的伪分布模式(1节点)的启动 .HBase ...
- Visual Studio Code (vscode)编译C++
Visual Studio Code (简称 VS Code / VSC) 是一款免费开源的现代化轻量级代码编辑器,支持几乎所有主流的开发语言的语法高亮.智能代码补全.自定义热键.括号匹配.代码片段. ...
- codeforces 388D Fox and Perfect Sets(线性基+数位dp)
#include<bits/stdc++.h> using namespace std; #define fi first #define se second #define mp mak ...
- Python中readline()函数 去除换行符
从Python中readline()函数读取的一行内容中含有换行符\n,很多时候我们需要处理不含有换行符的字符串,此时就要去掉换行符\n. 方法是使用strip()函数. 例子如下: f = open ...
- python连接数据库并插入数据
1.Python创建数据库 import MySQLdb try: conn = MySQLdb.connect( host="127.0.0.1", port=3306, use ...
- 组合数取模方法总结(Lucas定理介绍)
1.当n,m都很小的时候可以利用杨辉三角直接求. C(n,m)=C(n-1,m)+C(n-1,m-1): 2.n和m较大,但是p为素数的时候 Lucas定理是用来求 c(n,m) mod p,p为素数 ...
- Linux下的MBR分区
MBR分区 下面讲一讲如何给一块新添加入服务器的硬盘做MBR分区,那么为什么叫做MBR分区呢?后面会讲 做MBR分区,使用系统自带的fdisk工具.先看一看什么是fdisk,在命令行输入“fdisk” ...
- vue2.* 双向数据绑定 Vue事件介绍 以及Vue中的ref获取dom节点 04
<template> <div id="app"> <!-- 双向数据绑定(必须在表单里面使用) m:model v:view mvvm:model改 ...
- HTML5本地存储(Local Storage) 的前世今生
长久以来本地存储能力一直是桌面应用区别于Web应用的一个主要优势.对于桌面应用(或者原生应用),操作系统一般都提供了一个抽象层用来帮助应用程序保存其本地数据 例如(用户配置信息或者运行时状态等). 常 ...
- mysql5.6编译安装
1.安装编译源码所需的工具和库 yum install gcc gcc-c++ ncurses-devel perl -y yum -y install wget gcc-c++ ncurses nc ...