阅读:18943次   评论:5条   更新时间:2011-06-01    
这是Flex开发中处理列表数据最常用的组件,非常实用。支持排序,默认的CSS风格也很漂亮。
<?xml version="1.0"?>
<!-- DataGrid control example. -->
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml">

    <mx:XMLList id="employees">
        <employee>
            <name>Christina Coenraets</name>
            <phone>555-219-2270</phone>
            <email>ccoenraets@fictitious.com</email>
            <active>true</active>
        </employee>
        <employee>
            <name>Joanne Wall</name>
            <phone>555-219-2012</phone>
            <email>jwall@fictitious.com</email>
            <active>true</active>
        </employee>
        <employee>
            <name>Maurice Smith</name>
            <phone>555-219-2012</phone>
            <email>maurice@fictitious.com</email>
            <active>false</active>
        </employee>
        <employee>
            <name>Mary Jones</name>
            <phone>555-219-2000</phone>
            <email>mjones@fictitious.com</email>
            <active>true</active>
        </employee>
    </mx:XMLList>

    <mx:Panel title="DataGrid Control Example" height="100%" width="100%" 
        paddingTop="10" paddingLeft="10" paddingRight="10">

        <mx:Label width="100%" color="blue"
            text="请选中DataGrid的某一行."/>

        <mx:DataGrid id="dg" width="100%" height="100%" rowCount="5" dataProvider="{employees}">
            <mx:columns>
                <mx:DataGridColumn dataField="name" headerText="Name"/>
                <mx:DataGridColumn dataField="phone" headerText="Phone"/>
                <mx:DataGridColumn dataField="email" headerText="Email"/>
            </mx:columns>
        </mx:DataGrid>

        <mx:Form width="100%" height="100%">
            <mx:FormItem label="Name">
                <mx:Label text="{dg.selectedItem.name}"/>
            </mx:FormItem>
            <mx:FormItem label="Email">
                <mx:Label text="{dg.selectedItem.email}"/>
            </mx:FormItem>
            <mx:FormItem label="Phone">
                <mx:Label text="{dg.selectedItem.phone}"/>
            </mx:FormItem>
        </mx:Form>
        
    </mx:Panel>
</mx:Application>        

评论 共 5 条 请登录后发表评论
5 楼 tomfish88 2011-02-18 17:00
这不是官方例子么
4 楼 yabolove 2010-08-27 10:03
       
[img][/img]   
3 楼 ctwen 2010-04-25 17:49
不好意思,刚才我测试了一下,我那个问题,XML是没有问题的,可以这样指定dataField="friend.name"  ——  经过测试是可行的,但我之前的问题是,DataGrid的数据源不是XML了,而是一个ArrayCollection,
dataField="friend.name"——这种方式就不行了。

那如果是数据源是ArrayCollection类型的集合,请问该怎么办呢?
2 楼 ctwen 2010-04-25 17:30
嗯,因为目前遇到的,所以向您请教一下……
1 楼 ctwen 2010-04-25 17:28
dataField="name"——这个是可以的。

但如何结构是这样,要得到friend的name,请问在DataGrid 的dataField应该如指定?

#  <mx:XMLList id="employees"> 
#         <employee> 
#             <name>Christina Coenraets</name> 
#             <phone>555-219-2270</phone> 
#             <email>ccoenraets@fictitious.com</email> 
#             <active>true</active> 
#             <friend>
#               <name>小三<name>
#             </friend>  
#         </employee> 
#  </mx:XMLList> 

发表评论

您还没有登录,请您登录后再发表评论

文章信息

  • wxmfly在2009-06-01创建
  • wxmfly在2011-06-01更新
  • 标签: flex, datagrid, flex datagrid, flex3
Global site tag (gtag.js) - Google Analytics