Renderer Example: Data-binding

The mark-up below is, initially, the template that will be used to render data. When the "Render" button is clicked, the template will be replaced by the rendered mark-up. The model used to render the data will also be displayed below each column.

The wine list in this column is bound to its model. The model is not updated when the values of the inputs are changed. This must be triggered manually.

Wines

Model: 


This is where the bound model will be displayed.

The food lists in this column are bound to a model, which is automatically updated when the values of the inputs are changed.

Cheeses
Canapes

Model: 


This is where the auto-bound model will be displayed.