A DataGrid with a Custom ItemRenderer

hi all,

 

i have datagrid dataprovider bound simple array. have custom itemrenderer includes button can remove item (i don't want 2 separate columns remove button in 1 of them). however, don't understand behaviour - clicking button rearranges data in datagrid , duplicate entries! see example attached. idea what's happening?

 

martin.

 

<?xml version="1.0" encoding="utf-8"?>
<mx:application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute" creationcomplete="oncreationcomplete();" xmlns:local="*">
    <mx:script>
        <![cdata[
            [bindable]
            public var _data : array;
               
            protected function oncreationcomplete() : void {
                _data = new array();
                _data.push(1, 2, 3, 4, 5);
            }
        ]]>
    </mx:script>
    <mx:vbox>
        <mx:datagrid dataprovider="{_data}">
            <mx:columns>
                <mx:datagridcolumn>
                    <mx:itemrenderer>
                        <mx:component>
                            <mx:hbox implements="mx.controls.listclasses.idropinlistitemrenderer" creationcomplete="datalabel.text = string(data);">
                                <mx:script>
                                    <![cdata[
                                        import mx.collections.arraycollection;
                                        import mx.controls.datagrid;
                                        import mx.controls.listclasses.baselistdata;
                                       
                                        protected var _listdata : baselistdata;
                           
                                        public function listdata() : baselistdata {
                                            return _listdata;
                                        }
                                       
                                        public function set listdata(d : baselistdata) : void {
                                            _listdata = d;
                                        }
                                       
                                        protected function onclick(e : event) : void {
                                            var dp : arraycollection = (owner datagrid).dataprovider arraycollection;
                                            dp.removeitemat(listdata.rowindex);
                           
                                        }
                                    ]]>
                                </mx:script>
                                <mx:label id="datalabel" width="100%" />
                                <mx:button click="onclick(event);"/>
                            </mx:hbox>
                        </mx:component>
                    </mx:itemrenderer>
                </mx:datagridcolumn>
            </mx:columns>
        </mx:datagrid>
    </mx:vbox>
</mx:application>

creationcomplete used in renderers.  see itemrenderer posts on blog

 

alex harui

flex sdk developer

adobe systems inc.

blog: http://blogs.adobe.com/aharui

More discussions in Flex (Read Only)

adobe