master
Matt Huntington 2 years ago
parent 46602d6bb8
commit 595f50cf95

@ -25,11 +25,20 @@ const deleteItem = (event)=>{
event.target.parentNode.remove()
}
const updateItem = (event)=>{
event.preventDefault()
const newValue = event.target.parentNode.querySelector('input').value
event.target.parentNode.querySelector('h2').innerHTML = newValue
}
const createNewItem = (event)=>{
const template = document.querySelector('template').content.querySelector('li');
const newItem = template.cloneNode(true)
newItem.querySelector('.add').addEventListener('click',createNewItem);
newItem.querySelector('.delete').addEventListener('click',deleteItem);
newItem.querySelector('form').addEventListener('submit',updateItem);
if(event){
event.target.parentNode.querySelector('ul').appendChild(newItem)
} else {

@ -14,8 +14,12 @@
<h2>placeholder</h2>
<ul></ul>
<button class="add">Add</button>
<button class="edit">Edit</button>
<button class="delete">Delete</button>
<form>
<input typ="text" placeholder="new value"/>
<input type="submit" value="Update"/>
<input type="reset" value="Reset"/>
</form>
</li>
</template>
</body>

Loading…
Cancel
Save