0 Replies Latest reply on May 9, 2012 1:37 AM by Richard. Z.

    Issue with Spark GridItemRenderer binding data

    Richard. Z.

      Hello,

      I'm trying to do select all checkbox in a datagrid, here's my test code. I'm using flex 4.5.0.

      You can see that I binded the checkbox to the data provider, but when I change the data provider, all grid rows changed except for the 3rd row.

      You can see in the 3rd row the common column changed as well, only the GridItemRenderer column didn't change.

      I tried to add more rows to the grid and sometimes all rows work well, sometimes one or two rows don't work.

      I also tried to use String instead of Boolean for "selected" but it's the same.

      Very wierd... Could someone help me please, thank you so much.

       

      Update: I just found out that if there are lots of rows, it's always the row in the middle of the grid area that goes wrong. Is this a bug of the component?


      <?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"
                                       >
                <fx:Script>
                          <![CDATA[
                                    import mx.collections.ArrayCollection;

                                    [Bindable] protected var files:ArrayCollection = new ArrayCollection([
                                              {selected:false, fileName:"aaa"},
                                              {selected:false, fileName:"xxx"},
                                              {selected:false, fileName:"zzz"},
                                              {selected:false, fileName:"ddd"},
                                              {selected:false, fileName:"eee"},
                                    ]);

                                    public function doSelAll(selected:Boolean):void
                                    {
                                              for(var i:int=0;i<files.length;i++){
                                                        files.getItemAt(i).selected = selected;
                                              }
                                              files.refresh();
                                    }
                          ]]>
                </fx:Script>
                <s:DataGrid id="dataGrid" width="300" height="200" dataProvider="{files}" >
                          <s:columns>
                                    <s:ArrayList>
                                              <s:GridColumn sortable="false" headerText="check">
                                                        <s:itemRenderer>
                                                                  <fx:Component>
                                                                            <s:GridItemRenderer>
                                                                                      <s:CheckBox selected="{data.selected}" horizontalCenter="0" verticalCenter="0"/>
                                                                                      <s:Label text="{data.selected}"/>
                                                                            </s:GridItemRenderer>
                                                                  </fx:Component>
                                                        </s:itemRenderer>
                                              </s:GridColumn>
                                              <s:GridColumn dataField="selected"/>
                                              <s:GridColumn dataField="fileName"/>
                                    </s:ArrayList>
                          </s:columns>
                </s:DataGrid>
                <s:Button x="10" y="208" label="Select All" click="doSelAll(true)"/>
                <s:Button x="88" y="208" label="Deselect All" click="doSelAll(false)"/>
      </s:Application>