Skip to end of metadata
Go to start of metadata

Demonstrates how to manually trigger a UI update between the data model and a view.

App Folder Location


By default, a view is automatically updated whenever it's associated data collection changes. The dataFunction attribute of an Alloy element lets you provide an explicit name to the function that's auto-generated by the Allow compiler that, when called, performs this update. This lets you manually call this function when appropriate for your application.

The main XML view defines the <TableView/> element and assigns the value "updateUI" to the dataFunction attribute. It also provides some Labels (which act as buttons) to call the doChanges() and updateUI() functions defined in the view-controller.


Clicking Change in the sample app calls the doChanges() function, which modifies the data model used by the TableView. The model.set() method's second parameter is passed silent: true, which prevents the data binding from firing automatically. Clicking the Update button invokes the updateUI() function, which then causes the UI to update. 


The sample's  data collection is created by the alloy.js file.


See also