microsoft/frontend-bootcamp
1
0
Fork 0
mirror of https://github.com/microsoft/frontend-bootcamp.git synced 2026-01-26 14:56:42 +08:00
Code Issues Packages Projects Releases Wiki Activity

simplified the filter function in step 3, updated instructions to add it to the buttons. fixes #23

Browse Source
This commit is contained in:
Micah Godbolt
2019-02-27 09:26:36 -08:00
parent 17c9f2410a
commit e558da25ab
5 changed files with 23 additions and 12 deletions
Download Patch File Download Diff File Expand all files Collapse all files

17
step1-03/final/index.html
View File

@@ -6,14 +6,14 @@
<body>
<header>
<h1>todos</h1>
<form onsubmit="return addTodo()" class="addTodo">
<div class="addTodo">
<input class="textfield" placeholder="add todo" />
<button class="submit">Add</button>
</form>
<button onclick="addTodo()" class="submit">Add</button>
</div>
<nav class="filter">
<button onclick="filter('all', this)" class="selected">all</button>
<button onclick="filter('active', this)">active</button>
<button onclick="filter('completed', this)">completed</button>
<button onclick="filter(this)" class="selected">all</button>
<button onclick="filter(this)">active</button>
<button onclick="filter(this)">completed</button>
</nav>
</header>
@@ -53,7 +53,6 @@
}
function addTodo(ev) {
console.log('hello');
const todo = document.querySelector('.todo');
const newTodo = todo.cloneNode(true);
newTodo.querySelector('.title').innerText = getTodoText();
@@ -73,9 +72,11 @@
updateRemaining();
}
function filter(filterName, button) {
function filter(button) {
document.querySelector('.selected').classList.remove('selected');
button.classList.add('selected');
const filterName = button.innerText;
for (let todo of document.querySelectorAll('.todo')) {
const checked = todo.querySelector('input').checked == true;
if (filterName == 'all') {