From 944168eacb7818f4a2e0217b7407d36e2be9f2aa Mon Sep 17 00:00:00 2001 From: Oskar-Mikael Date: Sat, 20 Feb 2021 02:37:28 +0100 Subject: [PATCH] Add functionality for deleting list items --- script.js | 32 ++++++++++++++++++++++++-------- 1 file changed, 24 insertions(+), 8 deletions(-) diff --git a/script.js b/script.js index 58f2a60..a43fb52 100644 --- a/script.js +++ b/script.js @@ -3,29 +3,41 @@ let result = "" let input = $('#input'); $(function () { - $('form').on('submit', function(e) { + $('form').on('submit', function (e) { e.preventDefault(); }) }) -$(input).on('keypress', function(e) { - if(e.which == 13) { +$(input).on('keypress', function (e) { + if (e.which == 13) { addItem(); } }); -$('#add').on('click', function(){ +$('#add').on('click', function () { addItem() }) -$('#reset').on('click', function(){ - window.location.reload(); +$('#reset').on('click', function () { + location.reload(); }); -$('#submit').on('click', function(){ +$('#submit').on('click', function () { displayResult() }); +$(document).on('click', 'img.delete', function () { + let deletedItem = $(this).closest('li') + let itemValue = $(this).closest('li').text() + let index = items.indexOf(itemValue); + if(index != -1) { + items.splice(index, 1); + } + deletedItem.remove(); + console.log(itemValue) +}); + + function addItem() { @@ -35,8 +47,12 @@ function addItem() { items.push($(input).val()); let ul = $('#itemlist'); let li = document.createElement('li'); + let img = document.createElement('img') li.append($(input).val()); - ul.append(li) + ul.append(li); + li.append(img); + $(img).addClass('delete') + $(img).attr('src', '/close.png'); $(input).css('border', '1px solid black'); $(input).val(''); $('#inputError').html("")