[
https://issues.apache.org/jira/browse/FLEX-35197?page=com.atlassian.jira.plugin.system.issuetabpanels:comment-tabpanel&focusedCommentId=15752500#comment-15752500
]
Peter Ent commented on FLEX-35197:
----------------------------------
I took I look at what you are doing and ran your code and stepped through
things with the debugger.
Right now, the models, such as ArraySelectionModel, only know about full
replacement of the dataProvider. So when you created a new Array and replaced
it, the SimpleBinding picked up the PropertyChange event you dispatched in the
application's model and executed the assignment of replacing the value in the
DataGrid/List model. Because the pointers to the new data is different than the
point to the current data, the model dispatched a dataProviderChanged event.
This was then picked up the DataItemRendererFactory class which discarded all
of the itemRenderers it had previously created and generated new ones.
When you tried to update a single element, there was nothing watching for such
a change (ArrayList did dispatch an itemAdded or an itemUpdated event). The
SimpleBinding class had no knowledge of such an event so it did not alter the
DataGrid/List model to which it is bound.
Further, had SimpleBinding issued an event, the DataItemRendererFactory
wouldn't know what to do with it, as it is only listening for
dataProviderChanged. And then, it would have replaced all of the itemRenderers
with new ones.
Basically, FlexJS does not have capability right now to react to item
replacements, additions, or deletions. New models, binding classes, and
itemRenderer factories need to be created to handle these advanced situations.
> [FlexJS] Data-binding is broken or not implemented in DataGrid component
> ------------------------------------------------------------------------
>
> Key: FLEX-35197
> URL: https://issues.apache.org/jira/browse/FLEX-35197
> Project: Apache Flex
> Issue Type: Question
> Affects Versions: Apache FlexJS 0.8.0
> Reporter: Devsena
> Assignee: Peter Ent
> Attachments: src.zip
>
>
> (I've took the _DataGrid_ example that supplied within the nightly build of
> 0.8.0 FlexJS SDK bundle, and I tried all my tests in that project only)
> h3.Requirement
> Binding is a strong feature in Flex technology. As an user I also do expect
> that FlexJS will also empowers us with the same strength developing projects.
> While testing _DataGrid_ example that supplies within SDK bundle, I noticed
> that pay-as-you-go view only available but no actual run-time data binding
> (as far I tested); which is the strength that I was talking about. Is
> run-time data-binding (by any _beads_ or any other way) to DataGrid component
> is at all available yet?
> In the following tests I tried to update one row object's (_Product_) one
> particular field (_image_) value, to see it's change in row renderer, at
> run-time.
> I also tried to add or delete an item to it's _dataProvider_ collection to
> see their changes in DataGrid UI.
> h3.Actual Result
> Run-time data update to collection list not affecting to DataGrid UI.
> h3.How I Tested
> I've attached the source ZIP that supplied within SDK bundle and I modified
> few codes to test my requirement.
> The example consists of a DataGrid, and few buttons as follows:
> - Replace Array - replace the entire model with a new Array
> - Update Entry - Update the image for the first entry
> - Add Entry - Add a new entry to the end of the list
> - Remove Entry - Remove the first entry
> - Refresh - this recreates the array and saves it to the model. This forces
> the DataGrid to update by the same method as Replace Array
> "Replace Array" and "Refresh" worked fine. "Refresh" is a possible workaround
> for data update to grid UI, but it is inefficient for a real application. The
> other buttons did not cause DataGrid UI to update. The places which I've
> changed as follows.
> *Product.as*
> {code}
> // since I was trying to update one field at least to DataGrid UI, I added
> get/set methods to the _image_ field
> private var _image:String;
> [Bindable(event="imageChanged")]
> public function get image():String
> {
> return _image;
> }
>
> public function set image(value:String):void
> {
> if (value != _image)
> {
> _image = value;
> dispatchEvent(new Event("imageChanged"));
> }
> }
> {code}
> *MyInitialView.mxml*
> {code}
> // Replacing or recreating the collection list
> private function replaceArray():void
> {
> // Only this part worked when SimpleBinding used rather than
> ConstantBinding
> ProductsModel(applicationModel).productList = new ArrayList([new
> Product("ps220","Weejets",35,190,"assets/smallorangerect.jpg")]);
>
> writeStatus();
> }
> // Update an entry to the collection
> private function updateEntry():void
> {
> // This part not working or updating to DataGrid UI either
> /*ProductsModel(applicationModel).productList.source[1] = tmp;
> ProductsModel(applicationModel).dispatchEvent(new
> Event("propertyChange"));*/
> // This part not working or updating to DataGrid UI
> var tmp:Product =
> ProductsModel(applicationModel).productList.getItemAt(0) as Product;
> tmp.image = "Modified Text";
>
> writeStatus();
> }
> // Adding an item to the collection list
> private function addEntry():void
> {
> // Add a new entry to the list
> idCounter++;
> ProductsModel(applicationModel).productList.addItem(new
> Product("product" + idCounter, "Added" + idCounter, 35, 190,
> "assets/smallorangerect.jpg"));
>
> writeStatus();
> }
> // Removing an item from the collection list
> private function removeEntry():void
> {
> // remove the first item
> ProductsModel(applicationModel).productList.removeItemAt(0);
>
> writeStatus();
> }
> // Refreshing the collection to datagrid
> private function refresh():void
> {
> // force an update setting the model to the same value it already has.
> See replaceArray()
>
> // this was insufficient to trigger the update:
> // ProductsModel(applicationModel).productList =
> ProductsModel(applicationModel).productList;
>
> // Since there was NO refresh logic to ArrayList or DataGrid component,
> we only do a brute refresh to the list
> var oldArray:ArrayList = ProductsModel(applicationModel).productList;
> var newArray:ArrayList = new ArrayList();
> var index:int;
> for (index = 0; index < oldArray.length; index++) {
> newArray.addItem(oldArray.getItemAt(index));
> }
>
> ProductsModel(applicationModel).productList = newArray;
> writeStatus();
> }
> ...
> // DataGrid ConstantBinding bead replaced with SimpleBinding
> <js:DataGrid id="dataGrid" x="20" y="30" width="400" height="300"
> change="dataGridChange()" rowHeight="30">
> <js:beads>
> <js:SimpleBinding sourceID="applicationModel"
>
> sourcePropertyName="productList" destinationPropertyName="dataProvider"
> eventName="propertyChange"/>
> ...
> {code}
> I also created a new MXML based _DataItemRenderer_ component to see if
> binding is working anyway: *ProductItemRendererMXML.mxml*; But it didn't
> worked either.
> I discussed this at dev mailing-list
> (http://apache-flex-development.2333347.n4.nabble.com/Why-same-files-exists-in-multiple-places-td56983.html)
> where Alex suggested that a chain of specific beads usage may help this
> feature, but he wasn't sure if such beads already developed or not.
> Is there any such beads or procedure already available, or, in-development?
--
This message was sent by Atlassian JIRA
(v6.3.4#6332)