todomvc/examples/dojo/js/todo/app.html

> Helping you select an MV\* framework

<section>
	<header id="header">
	<h1>todos</h1>
	<input id="new-todo" data-dojo-attach-event="onkeypress:onKeyPress" placeholder="What needs to be done?" type="text" autofocus>
	<span class="ui-tooltip-top" style="display:none;">Press Enter to save this task</span>
	</header>

	<section id="main">
		<input id="toggle-all" data-dojo-attach-point="mark_all" data-dojo-attach-event="onclick:onMarkAll" type="checkbox">
		<label for="toggle-all">Mark all as complete</label>
		<ul id="todo-list" data-dojo-attach-point="todo_list" data-dojo-type="dojox.mvc.Repeat" data-dojo-props="ref: this.model.todos, exprchar: '#'">
			<li data-dojo-type="dojox.mvc.Group" data-dojo-props="ref: '#{this.index}'">
				<div class="view">
					<label class="dijitInline inline_edit" data-dojo-type="todo.form.InlineEditBox"
						data-dojo-props='ref: "title", editor:"dijit.form.TextBox", autosave:true'></label>

					<input class="toggle" type="checkbox" data-dojo-type="todo.form.CheckBox" data-dojo-props='ref: "completed"'>
					<button class="destroy" data-model-id="#{this.index}">
					</button>
				</div>
			</li>
		</ul>
	</section>

	<footer id="footer" data-dojo-attach-point="todo_stats">
		<span id="todo-count">
			<strong>
				<span data-dojo-type="dojox.mvc.Output" data-dojo-props="ref: this.model.incomplete" class="number"></span>
			</strong>
			<span class="word">item<span class="plural">s</span></span> left
		</span>
			<ul id="filters">
				<li>
					<a class="selected" href="#/">All</a>
				</li>
				<li>
					<a href="#/active">Active</a>
				</li>
				<li>
					<a href="#/completed">Completed</a>
				</li>
			</ul>
		<button id="clear-completed" data-dojo-attach-event="onclick:removeCompletedItems">
			Clear completed (<span class="number-done" data-dojo-type="dojox.mvc.Output" data-dojo-props="ref: this.model.complete"></span>)
		</button>
	</footer>
</section>