5 Replies Latest reply on Oct 8, 2010 3:59 PM by j.ochoa

    Why is sortCompareFunction called when clicking checkbox on non-sortable column?

    j.ochoa

      Hello,

       

      I have a datagrid that contains three static DataGridColumn columns.  The first column uses a checkbox item renderer whose sortable property is set to false:

       

      <mx:DataGridColumn

      width="100"

      sortable="false"

      itemRenderer="com.mycomponent.CheckBoxItemRenderer" />

       

      On creation complete, a fourth column is added dynamically to the datagrid, through ActionScript, and several of its properties are set, like so:

       

      var dgc : DataGridColumn = new DataGridColumn();

      dgc.headerText = someAttribute.name;

      dgc.itemRenderer = new ClassFactory(ProductResultItemRenderer);

      dgc.sortCompareFunction = attributeCompareFunction;

      ...

       

      Everything is rendered just fine.  If I sort the datagrid items by clicking the column header of the second or third columns (these are the static columns that use Flex's default sort function) and then click on any of the items' checkboxes, there are no issues.  However, if I sort the items by clicking on the header of the dynamically-added fourth column and then click on any of the items' checkboxes, the results are partially re-sorted.  Setting a breakpoint in my attributeCompareFunction method, any time I click a checkbox in this use case, this compare function is called.

       

      Can someone shed some light on why this function is invoked in this last use case, especially when performing a non-sortable event (clicking on a checkbox)?

       

      Thanks,

      -Jose

        • 1. Re: Why is sortCompareFunction called when clicking checkbox on non-sortable column?
          Flex harUI Adobe Employee

          If checking the checkbox changes the dataprovider because you are storing

          selected state in the VO's then it might cause another sort.

          1 person found this helpful
          • 2. Re: Why is sortCompareFunction called when clicking checkbox on non-sortable column?
            j.ochoa Level 1

            Toggling the checkbox does update a property in the VO, so that makes sense, thank you.  Since that property is basically just a boolean flag and should have no bearing on the sort order of the items, is there a way to prevent the re-sort?  Does this re-sort only happen for columns that are assigned a custom sort function (no re-sort occurs when clicking a checkbox after having sorted one of the other columns)?

             

            Thanks!

            -Jose

            • 3. Re: Why is sortCompareFunction called when clicking checkbox on non-sortable column?
              Flex harUI Adobe Employee

              You might be able to customize the VO so toggling the value doesn't dispatch

              change events, but first set a breakpoint in the sortCompareFunction and see

              how it is getting called.  I just looked at the code and it wasn't obvious

              what logic would call the re-sort.

              • 4. Re: Why is sortCompareFunction called when clicking checkbox on non-sortable column?
                j.ochoa Level 1

                Hi Alex,

                 

                I set a breakpoint in the sortCompareFunction, but I'm unable to determine what is calling it.  Here is the call stack:

                 

                Main Thread (Suspended)

                Function/<anonymous>

                mx.collections::SortField/http://www.adobe.com/2006/flex/mx/internal::internalCompare

                mx.collections::Sort/internalCompare

                mx.collections::Sort/findItem

                mx.collections::ListCollectionView/http://www.adobe.com/2006/flex/mx/internal::findItem

                mx.collections::ListCollectionView/addItemsToView

                mx.collections::ListCollectionView/moveItemInView

                mx.collections::ListCollectionView/handlePropertyChangeEvents

                mx.collections::ListCollectionView/listChangeHandler

                flash.events::EventDispatcher/dispatchEventFunction [no source]

                flash.events::EventDispatcher/dispatchEvent [no source]

                mx.collections::ArrayList/internalDispatchEvent

                mx.collections::ArrayList/itemUpdateHandler

                flash.events::EventDispatcher/dispatchEventFunction [no source]

                flash.events::EventDispatcher/dispatchEvent [no source]

                com.my.package.models::ProductVO/dispatchEvent [no source]

                com.my.package.models::ProductVO/set compare [no source]

                com.my.package.components::CheckBoxItemRenderer/onChange

                com.my.package.components::CheckBoxItemRenderer/___CheckBoxItemRenderer_CheckBox1_change

                flash.events::EventDispatcher/dispatchEventFunction [no source]

                flash.events::EventDispatcher/dispatchEvent [no source]

                mx.core::UIComponent/dispatchEvent

                spark.components.supportClasses::ToggleButtonBase/buttonReleased

                spark.components.supportClasses::ButtonBase/mouseEventHandler

                 

                The event dispatched by "ProductVO/dispatchEvent" is of type "mx.events.PropertyChangeEvent", which is OK since the "compare" property was updated.  However, later in the call stack, the "ArrayList" object fires an "internalDispatchEvent" of type "mx.events.CollectionEvent", which is an "update" event.  Looking at the rest of the call stack, this is the event that leads to the re-sort.

                 

                Is there any way to prevent this CollectionEvent event from firing and, if so, how?

                 

                Thanks,

                -Jose

                • 5. Re: Why is sortCompareFunction called when clicking checkbox on non-sortable column?
                  j.ochoa Level 1

                  OK, in case anyone else runs into a similar issue, I found a solution to my problem in the Adobe documentation at this URL:

                   

                  http://help.adobe.com/en_US/flex/using/WS2db454920e96a9e51e63e3d11c0bf668d2-7fe7.html

                   

                  Specifically, the paragraph pertinent to my issue is this one:

                   

                  Disabling and enabling automatic updating

                  A collection’s disableAutoUpdate() method prevents events that represent changes to the underlying data from being broadcast by the view. It also prevents the collection from being updated as a result of these changes.

                  Use this method to prevent the collection, and therefore the control that uses it as a data provider, from showing intermediate changes in a set of multiple changes. The DataGrid class, for example, uses the disableAutoUpdate() method to prevent updates to the collection while a specific item is selected. When the item is no longer selected, the DataGrid control calls the enableAutoUpdate() method. Doing this ensures that, if a DataGrid control uses a sorted collection view, items that you edit do not jump around while you’re editing.

                  You can also use the disableAutoUpdate() method to optimize performance in cases where multiple items in a collection are being edited at once. By disabling the auto update until all changes are made, a control like the DataGrid control can receive an update event as a single batch instead of reacting to multiple events.

                   

                  So, the solution is simply to call the disableAutoUpdate() method on the collection (data provider) assigned to my datagrid object, so that it doesn't update its view when a property of a VO (an item in the collection) is updated.

                   

                  Thanks,

                  -Jose