dojox
Version:
Dojo eXtensions, a rollup of many useful sub-projects and varying states of maturity – from very stable and robust, to alpha and experimental. See individual projects contain README files for details.
91 lines (89 loc) • 3.3 kB
HTML
<div id="settings" class="view mblView">
<script type="dojo/require">at: "dojox/mvc/at"</script>
<h2 data-dojo-type="dojox/mobile/EdgeToEdgeCategory" style="height: 32px;" data-app-constraint="top">Simple Data Binding Example</h2>
<form name="testForm" id="testForm">
<div class="field-title">
Ship to - Bill to Address
</div>
<div class="fieldset" data-dojo-type="dojox/mvc/Group" data-dojo-props="target: at(this.loadedModels.names, 'model')">
<div data-dojo-type="dojox/mvc/Group" data-dojo-props="target: at('rel:', 0)">
<table id="table" cellspacing="10" style="width: 100%">
<tr>
<td style="width: 100px;" class="layout">
First
</td>
<td class="layout">
<input id="firstInput1" data-dojo-type="dojox/mobile/TextBox" data-dojo-props="value: at('rel:', 'First'), placeholder:'First'">
</td>
</tr>
<tr>
<td style="width: 100px;" class="layout">
Last Name
</td>
<td class="layout">
<input id="lastInput1" data-dojo-type="dojox/mobile/TextBox" data-dojo-props="placeholder:'Last Name', value: at('rel:', 'Last')">
</td>
</tr>
<tr>
<td style="width: 100px;" class="layout">
Email
</td>
<td class="layout">
<input id="emailInput1" data-dojo-type="dojox/mobile/TextBox" data-dojo-props="value: at('rel:', 'Email'), placeholder:'Email'">
</td>
</tr>
</table>
<div class="spacer">
</div>
<button id="shipto" type="button" data-dojo-type="dojox/mobile/Button" class="mblBlueButton">
Ship To
</button>
<button id="billto" type="button" data-dojo-type="dojox/mobile/Button" class="mblBlueButton">
Bill To
</button>
<br/>
<div class="fieldset" id="addrGroup" data-dojo-type="dojox/mvc/Group" data-dojo-props="target: at('rel:','ShipTo')">
<table id="table" cellspacing="10" style="width: 100%">
<tr>
<td style="width: 100px;" class="layout">
Street
</td>
<td class="layout">
<input id="streetInput" data-dojo-type="dojox/mobile/TextBox" data-dojo-props="value: at('rel:', 'Street'), placeholder:'Street'">
</td>
</tr>
<tr>
<td style="width: 100px;" class="layout">
City
</td>
<td class="layout">
<input id="cityInput" data-dojo-type="dojox/mobile/TextBox" data-dojo-props="placeholder:'City', value: at('rel:', 'City')">
</td>
</tr>
<tr>
<td style="width: 100px;" class="layout">
State
</td>
<td class="layout">
<input id="StateInput" data-dojo-type="dojox/mobile/TextBox" data-dojo-props="value: at('rel:', 'State'), placeholder:'State'">
</td>
</tr>
<tr>
<td style="width: 100px;" class="layout">
State
</td>
<td class="layout">
<input id="ZipInput" data-dojo-type="dojox/mobile/TextBox" data-dojo-props="value: at('rel:', 'Zip'), placeholder:'Zip Code'">
</td>
</tr>
</table>
</div>
</div>
</div>
<div class="spacer">
</div>
<button id="reset1" type="button" data-dojo-type="dojox/mobile/Button" class="mblBlueButton">
Reset
</button>
</form>
</div>