[ALOY-1500] Provide an accessor method for alloy bound elements.

GitHub Issue	n/a
Type	New Feature
Priority	High
Status	Open
Resolution	Unresolved
Affected Version/s	n/a
Fix Version/s	n/a
Components	Tooling
Labels	n/a
Reporter	Dee Clawson
Assignee	Fokke Zandbergen
Created	2016-05-13T16:41:28.000+0000
Updated	2017-10-30T18:32:55.000+0000

Description

Currently we have not found a way to access elements that are bound. Example I can't change the button color of a button that has been bound inside a table. We've tried: $[e.source.id] this[e.source.id] eval[e.source.id] Either the scope of these elements needs to be documented, or a method to update these should be provided.

Comments

Sharif AbuDarda 2016-05-13

Hello, Thanks for creating the ticket. Our engineers will look into it. In the mean time can you please provide a visualisation of the feature available in native platform. Possibly in screenshots or in a video?. I will move this ticket to engineering for consideration. Any more information is much appreciated. Thanks.

Dee Clawson 2016-05-16

I'm not sure they is a native feature in the native platform. This whole scheme of binding and backbone is something that Appcelerator came up with. This should be a standard feature. If I bind a collection to table, have a onClick method on that bound element. I should be able to access that element somehow. Looking through how alloy compiles in the resources folder it looks to be a basic error in how the elements are created. Take binding to a table for example:

   for (var i = 0; len > i; i++) {
       //create table view row
       var __alloyId73 = Ti.UI.createButton({
                   right: 0,
                   top: 20,
                   width: 50,
                   height: 50,
                   backgroundImage: "/images/assetspec.png",
                   model: _.template("{m.id}", {
                       m: __alloyId63.__transform
                   }, {
                       interpolate: /\{([\s\S]+?)\}/g
                   }),
                   visible: _.template("{m.HAS_SPEC_VISIBLE}", {
                       m: __alloyId63.__transform
                   }, {
                       interpolate: /\{([\s\S]+?)\}/g
                   })
               });
       //close table view row
   }

I cant access that button because my table has 200 buttons all with the id of __alloyId73. I would think if you did something like add the iterator to decleration with a simple [i] it would solve the problem.

   var __alloyId73[i] = Ti.UI.createButton({

Dee Clawson 2016-05-17

I have a better use case for this as well. We build forms using tables with a text box in each cell. We want to create a format mask as the user types text into some fields but we can't access the field from the onChange event. The theory is that when the onChange event fires we should check the text fields given text and change it according to the format mask. We can't update the model because we would loose the blur in the field. We can do this no titanium without problem, but the feature isn't there using alloy when we've bound a collection to something because all the text fields have the same, and I believe they are out of scope.
Fokke Zandbergen 2016-05-23

[~kdclaw3@gmail.com] Could you include a very simpel XML view + controller as an example use case of what you'd want to achieve?
Fokke Zandbergen 2017-10-30

@hknoechel could you unassign me? ;)

JSON Source