获取特定单元格的ItemRenderer - Flex DataGrid

时间:2012-05-23 05:42:08

标签: flex dynamic datagrid runtime itemrenderer

我有一个包含2列的数据网格。每当column-1值更改时,我都需要访问第二列的项呈示器。即如果第1列的值为A-需要在第2列中显示文本字段,如果值为B,则需要显示下拉列表。

Col1中---------- col2的

A ---------- DropDown

B ---------- TextBox

A ---------- DropDown

任何解决方案???

public class ItemRendererfroDropTest extends GridItemRenderer
{
    private var dropdown:DropDownList;
    public function ItemRendererfroDropTest()
    {
        super();
        dropdown=new DropDownList();
        dropdown.dataProvider=new ArrayCollection(new Array("ABC","PQR"));
        this.addElement(dropdown);
        dropdown.addEventListener(FlexEvent.VALUE_COMMIT,dataChanged);
    }

    private function dataChanged(event:FlexEvent):void
    {
        owner.dispatchEvent(new CustomEvent(CustomEvent.DATA_CHANGED,true));
    }

}


public class ItemRenderlabel extends GridItemRenderer
{
    public var wlabel:Label=new Label();
    public var checkbox:CheckBox=new CheckBox();

    public function ItemRenderlabel()
    {
        super();
        this.addEventListener(CustomEvent.DATA_CHANGED,mappingChanged,true);
        this.addElement(wlabel);
    }
    private function mappingChanged(e:CustomEvent):void
    {
        Alert.show("asfAS");
    }
}

2 个答案:

答案 0 :(得分:0)

使用ViewStack创建项目渲染器,根据需要使用视图,并覆盖数据功能,如通常对项目渲染器所做的那样,设置容器基础字段的活动子项,如果要设置活动子项,请参阅此{ {3}}

希望有所帮助

答案 1 :(得分:0)

您可以从以下代码中获得一些想法: - 事件您只能通过使用dpHierarchy.itemUpdated()更新单个行来为特定项目执行此操作。

<?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" minWidth="955" minHeight="600"
               creationComplete="init()">
    <fx:Declarations>
        <!-- Place non-visual elements (e.g., services, value objects) here -->
    </fx:Declarations>
    <fx:Script>
        <![CDATA[
            import mx.collections.ArrayCollection;
            import mx.events.FlexEvent;

            [Bindable]
            private var dpHierarchy:ArrayCollection= new ArrayCollection([
                {name:"A", region: "Arizona"},
                {name:"B", region: "Arizona"},
                {name:"C", region: "California"},
                {name:"D", region: "California"}
            ]); 

            private function init():void
            {
                this.addEventListener(FlexEvent.DATA_CHANGE, changeDataHandler);
            }

            private function changeDataHandler(event:FlexEvent):void
            {
                dpHierarchy.refresh();
            } 
        ]]>
    </fx:Script>

    <mx:AdvancedDataGrid id="myADG" 
                         width="100%" height="100%" 
                         variableRowHeight="true" dataProvider="{dpHierarchy}">
        <mx:columns>
            <mx:AdvancedDataGridColumn dataField="name" headerText="Name" itemRenderer="AddComboboxADG"/>
            <mx:AdvancedDataGridColumn dataField="region" headerText="Region" itemRenderer="SelectedCustomComponent"/>
        </mx:columns>   

    </mx:AdvancedDataGrid>

</s:Application>

// AddComboboxADG自定义项目渲染器

<?xml version="1.0" encoding="utf-8"?>
<s:MXAdvancedDataGridItemRenderer xmlns:fx="http://ns.adobe.com/mxml/2009" 
                                  xmlns:s="library://ns.adobe.com/flex/spark" 
                                  xmlns:mx="library://ns.adobe.com/flex/mx" 
                                  focusEnabled="true">
    <fx:Script>
        <![CDATA[
            import mx.controls.AdvancedDataGrid;
            import mx.controls.advancedDataGridClasses.AdvancedDataGridColumn;
            import mx.controls.advancedDataGridClasses.AdvancedDataGridHeaderRenderer;
            import mx.controls.advancedDataGridClasses.AdvancedDataGridListData;
            import mx.events.AdvancedDataGridEvent;
            import mx.events.DataGridEvent;
            import mx.events.FlexEvent;
            import mx.events.ItemClickEvent;

            import spark.components.supportClasses.ItemRenderer;
            import spark.events.IndexChangeEvent;


            protected function comboBoxID_changeHandler(event:IndexChangeEvent):void
            {
                data.name = comboBoxID.selectedItem;
                dispatchEvent(new FlexEvent(FlexEvent.DATA_CHANGE, true));
            }

            override public function set data(value:Object):void
            {
                super.data = value;

                if(data.name == "A")
                {
                    comboBoxID.selectedIndex = 0;
                }else if(data.name == "B")
                {
                    comboBoxID.selectedIndex = 1;
                }else if(data.name == "C")
                {
                    comboBoxID.selectedIndex = 2;   
                }else
                {
                    comboBoxID.selectedIndex = 3;
                }
            }

        ]]>
    </fx:Script>

    <s:DropDownList id="comboBoxID" change="comboBoxID_changeHandler(event)">
        <s:ArrayCollection>
            <fx:String>A</fx:String>
            <fx:String>B</fx:String>
            <fx:String>C</fx:String>
            <fx:String>D</fx:String>
        </s:ArrayCollection>
    </s:DropDownList>
</s:MXAdvancedDataGridItemRenderer>

// SelectedCustomComponent自定义项呈示器

<?xml version="1.0" encoding="utf-8"?>
<s:MXAdvancedDataGridItemRenderer xmlns:fx="http://ns.adobe.com/mxml/2009" 
                                  xmlns:s="library://ns.adobe.com/flex/spark" 
                                  xmlns:mx="library://ns.adobe.com/flex/mx" 
                                  focusEnabled="true">
    <fx:Script>
        <![CDATA[
            override public function set data(value:Object):void
            {
                super.data = value;
                customFirstDropDown.visible = customTextInput.visible = customSecondDropDown.visible = lblData.visible = false;

                if(data.name == "A")
                {
                    customFirstDropDown.visible = true;
                }else if(data.name == "B")
                {
                    customTextInput.visible = true;
                }else if(data.name == "C")
                {
                    customSecondDropDown.visible = true;    
                }else
                {
                    lblData.visible = true;
                }
            }
        ]]>
    </fx:Script>

    <s:DropDownList id="customFirstDropDown" visible="false" selectedIndex="0">
        <s:ArrayCollection>
            <fx:String>First</fx:String>
            <fx:String>Second</fx:String>
            <fx:String>Third</fx:String>
        </s:ArrayCollection>
    </s:DropDownList>
    <s:TextInput id="customTextInput" visible="false" text="Selected"/>
    <s:DropDownList id="customSecondDropDown" visible="false" selectedIndex="0">
        <s:ArrayCollection>
            <fx:String>1</fx:String>
            <fx:String>2</fx:String>
            <fx:String>3</fx:String>
        </s:ArrayCollection>
    </s:DropDownList>   

    <s:Label id="lblData" visible="false" text="Selected"/>
</s:MXAdvancedDataGridItemRenderer>
相关问题