Create a gist now

Instantly share code, notes, and snippets.

What would you like to do?
<template>
<require from="./date-format"></require>
<require from="./filter"></require>
<div class="container">
<h1>todo list</h1>
<hr/>
<div class="panel panel-default">
<div class="panel-heading">
<div class="container">
<div class="row">
<input type="text" class="form-control col-md-2 search-box" value.bind="searchTerm" placeholder="search..." ></input>
<button class="btn btn-default col-md-2 clear-btn" if.bind="searchTerm.length > 0" click.delegate="clearFilter()"><i class="fa fa-times"></i> clear</button>
</div>
</div>
</div>
<div class="panel-body">
<table class="table table-striped table-bordered">
<thead>
<tr>
<th>Id</th>
<th>Text</th>
<th>Created At</th>
<th>Complete?</th>
</tr>
</thead>
<tbody>
<tr repeat.for="todoItem of todoItems | filter:searchTerm:filterFunc">
<td>${todoItem.id}</td>
<td><span class="${todoItem.is_complete ? 'completed-task' : 'incomplete-task'}"> ${todoItem.text} </span></td>
<td>${todoItem.created_at | dateFormat}</td>
<td><input type="checkbox"checked.bind="todoItem.is_complete"></input></td>
</tr>
</tbody>
</table>
</div>
</div>
</div>
</template>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment