dojox.mvc.Repeat¶
Authors: | Rahul Akolkar, Ed Chatelain |
---|---|
Developers: | Rahul Akolkar, Ed Chatelain |
since: | V1.7 |
Contents
A repeat is bound to an intermediate dojo.Stateful node corresponding to an array in the data model. Child dijits or custom view components inside it inherit their parent data binding context from it.
Parameters¶
Parameter | Type | Default | Description |
ref | String or StatefulModel | The value of the data binding expression passed declaratively by the developer. This usually references a location within an existing datamodel and may be a relative reference based on the parent / container data binding (dot-separated string). | |
index | Integer | An index used to track the current iteration when the repeating UI is produced. This may be used to parameterize the content in the repeat template for the current iteration. | |
exprchar | Character | ‘$’ | Character to use for a substitution expression, for a substitution string like ${this.index} |
Examples¶
Declarative example¶
var search_results_init = {
"Query" : "Engineers",
"Results" : [
{
"First": "Anne",
"Last" : "Ackerman",
"Email": "[email protected]"
},
{
"First": "Ben",
"Last" : "Beckham",
"Email": "[email protected]"
},
{
"First": "John",
"Last" : "Jacklin",
"Email": "[email protected]"
}
]
};
// The dojox.mvc.StatefulModel class creates a data model instance
// where each leaf within the data model is decorated with dojo.Stateful
// properties that widgets can bind to and watch for their changes.
var searchRecords = dojox.mvc.newStatefulModel({ data : search_results_init });
<div data-dojo-type="dojox.mvc.Group" data-dojo-props="ref: 'searchRecords'">
<!--
The repeat container denotes a templated UI that operates over a collection
of data records.
The UI can be customized for each iteration using properties such as
${this.index} for the iteration index.
-->
<div id="repeatId" data-dojo-type="dojox.mvc.Repeat" data-dojo-props="ref: 'results'">
<div class="row" data-dojo-type="dojox.mvc.Group" data-dojo-props="ref: '${this.index}'">
<label class="cell" for="nameInput${this.index}">Name:</label>
<input class="cell" data-dojo-type="dijit.form.TextBox" id="nameInput${this.index}"
data-dojo-props="ref: 'First'"></input>
</div>
</div>
</div>
In the above example, the TextBoxes inside the repeat with the id=”repeatId” will display the firstname of each of the entries in the model.