From 8eaa64a6f22892f4edd5d134dbbb861d2ff504ac Mon Sep 17 00:00:00 2001 From: Vitalii Kmit Date: Fri, 14 Aug 2026 20:16:08 +0100 Subject: [PATCH 01/17] Fix errors --- debugging/book-library/script.js | 8 ++++---- 1 file changed, 4 insertions(+), 4 deletions(-) diff --git a/debugging/book-library/script.js b/debugging/book-library/script.js index 75ce6c1d3..03b671e7c 100644 --- a/debugging/book-library/script.js +++ b/debugging/book-library/script.js @@ -38,7 +38,7 @@ function submit() { return false; } else { let book = new Book(title.value, title.value, pages.value, check.checked); - library.push(book); + myLibrary.push(book); render(); } } @@ -54,7 +54,7 @@ function render() { let table = document.getElementById("display"); let rowsNumber = table.rows.length; //delete old table - for (let n = rowsNumber - 1; n > 0; n-- { + for (let n = rowsNumber - 1; n > 0; n--) { table.deleteRow(n); } //insert updated row and cells @@ -89,12 +89,12 @@ function render() { }); //add delete button to every row and render again - let delButton = document.createElement("button"); + let delBut = document.createElement("button"); delBut.id = i + 5; deleteCell.appendChild(delBut); delBut.className = "btn btn-warning"; delBut.innerHTML = "Delete"; - delBut.addEventListener("clicks", function () { + delBut.addEventListener("click", function () { alert(`You've deleted title: ${myLibrary[i].title}`); myLibrary.splice(i, 1); render(); From b7a0641e73cea5496a6feeaf81ba2386a8a6fd84 Mon Sep 17 00:00:00 2001 From: Vitalii Kmit Date: Fri, 14 Aug 2026 20:26:56 +0100 Subject: [PATCH 02/17] Display author and check correclty --- debugging/book-library/script.js | 6 ++++-- 1 file changed, 4 insertions(+), 2 deletions(-) diff --git a/debugging/book-library/script.js b/debugging/book-library/script.js index 03b671e7c..be5d0646a 100644 --- a/debugging/book-library/script.js +++ b/debugging/book-library/script.js @@ -31,13 +31,15 @@ function submit() { if ( title.value == null || title.value == "" || + author.value == null || + author.value == "" || pages.value == null || pages.value == "" ) { alert("Please fill all fields!"); return false; } else { - let book = new Book(title.value, title.value, pages.value, check.checked); + let book = new Book(title.value, author.value, pages.value, check.checked); myLibrary.push(book); render(); } @@ -76,7 +78,7 @@ function render() { changeBut.className = "btn btn-success"; wasReadCell.appendChild(changeBut); let readStatus = ""; - if (myLibrary[i].check == false) { + if (myLibrary[i].check) { readStatus = "Yes"; } else { readStatus = "No"; From c27230bdf2993d7a84742e4462cfb1165c50c772 Mon Sep 17 00:00:00 2001 From: Vitalii Kmit Date: Sat, 15 Aug 2026 10:40:27 +0100 Subject: [PATCH 03/17] Convert script into module --- debugging/book-library/index.html | 6 +++--- debugging/book-library/script.js | 4 +++- 2 files changed, 6 insertions(+), 4 deletions(-) diff --git a/debugging/book-library/index.html b/debugging/book-library/index.html index 23acfa71e..9db50df38 100644 --- a/debugging/book-library/index.html +++ b/debugging/book-library/index.html @@ -1,4 +1,4 @@ - + @@ -65,7 +65,7 @@

Library

type="submit" value="Submit" class="btn btn-primary" - onclick="submit();" + onclick="submit()" /> @@ -91,6 +91,6 @@

Library

- + diff --git a/debugging/book-library/script.js b/debugging/book-library/script.js index be5d0646a..cf6e2aa12 100644 --- a/debugging/book-library/script.js +++ b/debugging/book-library/script.js @@ -27,7 +27,7 @@ const check = document.getElementById("check"); //check the right input from forms and if its ok -> add the new book (object in array) //via Book function and start render function -function submit() { +export function submit() { if ( title.value == null || title.value == "" || @@ -103,3 +103,5 @@ function render() { }); } } + +window.submit = submit; From d9215d8e24c5194596df5783efc34f8af41c3978 Mon Sep 17 00:00:00 2001 From: Vitalii Kmit Date: Sat, 15 Aug 2026 19:48:30 +0100 Subject: [PATCH 04/17] apply suggestions from https://validator.w3.org --- debugging/book-library/index.html | 15 ++++++--------- debugging/book-library/style.css | 2 +- 2 files changed, 7 insertions(+), 10 deletions(-) diff --git a/debugging/book-library/index.html b/debugging/book-library/index.html index 9db50df38..132d09838 100644 --- a/debugging/book-library/index.html +++ b/debugging/book-library/index.html @@ -1,12 +1,9 @@ - + - - + Book library + + @@ -31,7 +28,7 @@

Library

Library /> Date: Sun, 16 Aug 2026 20:55:30 +0100 Subject: [PATCH 05/17] Add html validation --- debugging/book-library/index.html | 26 +++++++++++++------------- debugging/book-library/script.js | 14 ++++---------- 2 files changed, 17 insertions(+), 23 deletions(-) diff --git a/debugging/book-library/index.html b/debugging/book-library/index.html index 132d09838..2090f28f1 100644 --- a/debugging/book-library/index.html +++ b/debugging/book-library/index.html @@ -13,25 +13,24 @@ /> -

Library

Add books to your virtual library

- -
-
+
@@ -40,6 +39,8 @@

Library

class="form-control" id="author" name="author" + minlength="1" + maxlength="100" required /> @@ -48,6 +49,9 @@

Library

class="form-control" id="pages" name="pages" + min="1" + max="20000" + step="1" required /> - +
- @@ -87,7 +88,6 @@

Library

- diff --git a/debugging/book-library/script.js b/debugging/book-library/script.js index cf6e2aa12..2b729da67 100644 --- a/debugging/book-library/script.js +++ b/debugging/book-library/script.js @@ -1,10 +1,8 @@ let myLibrary = []; - window.addEventListener("load", function (e) { populateStorage(); render(); }); - function populateStorage() { if (myLibrary.length == 0) { let book1 = new Book("Robison Crusoe", "Daniel Defoe", "252", true); @@ -19,15 +17,15 @@ function populateStorage() { render(); } } - const title = document.getElementById("title"); const author = document.getElementById("author"); const pages = document.getElementById("pages"); const check = document.getElementById("check"); +const addBookBtn = document.getElementById("addBook"); //check the right input from forms and if its ok -> add the new book (object in array) //via Book function and start render function -export function submit() { +function addBook() { if ( title.value == null || title.value == "" || @@ -45,13 +43,14 @@ export function submit() { } } +addBookBtn.addEventListener("click", addBook); + function Book(title, author, pages, check) { this.title = title; this.author = author; this.pages = pages; this.check = check; } - function render() { let table = document.getElementById("display"); let rowsNumber = table.rows.length; @@ -71,7 +70,6 @@ function render() { titleCell.innerHTML = myLibrary[i].title; authorCell.innerHTML = myLibrary[i].author; pagesCell.innerHTML = myLibrary[i].pages; - //add and wait for action for read/unread button let changeBut = document.createElement("button"); changeBut.id = i; @@ -84,12 +82,10 @@ function render() { readStatus = "No"; } changeBut.innerText = readStatus; - changeBut.addEventListener("click", function () { myLibrary[i].check = !myLibrary[i].check; render(); }); - //add delete button to every row and render again let delBut = document.createElement("button"); delBut.id = i + 5; @@ -103,5 +99,3 @@ function render() { }); } } - -window.submit = submit; From 7f4447e2f99a9792604ae298552e5add68bdc0ac Mon Sep 17 00:00:00 2001 From: Vitalii Kmit Date: Sun, 16 Aug 2026 21:01:19 +0100 Subject: [PATCH 06/17] Change page count to Integer --- debugging/book-library/script.js | 22 ++++++++++------------ 1 file changed, 10 insertions(+), 12 deletions(-) diff --git a/debugging/book-library/script.js b/debugging/book-library/script.js index 2b729da67..39603f89a 100644 --- a/debugging/book-library/script.js +++ b/debugging/book-library/script.js @@ -3,18 +3,18 @@ window.addEventListener("load", function (e) { populateStorage(); render(); }); + function populateStorage() { if (myLibrary.length == 0) { - let book1 = new Book("Robison Crusoe", "Daniel Defoe", "252", true); + let book1 = new Book("Robison Crusoe", "Daniel Defoe", 252, true); let book2 = new Book( "The Old Man and the Sea", "Ernest Hemingway", - "127", + 127, true ); myLibrary.push(book1); myLibrary.push(book2); - render(); } } const title = document.getElementById("title"); @@ -26,18 +26,16 @@ const addBookBtn = document.getElementById("addBook"); //check the right input from forms and if its ok -> add the new book (object in array) //via Book function and start render function function addBook() { - if ( - title.value == null || - title.value == "" || - author.value == null || - author.value == "" || - pages.value == null || - pages.value == "" - ) { + if (title.value == "" || author.value == "" || pages.value == "") { alert("Please fill all fields!"); return false; } else { - let book = new Book(title.value, author.value, pages.value, check.checked); + let book = new Book( + title.value, + author.value, + Number(pages.value), + check.checked + ); myLibrary.push(book); render(); } From a1f24941d5a745e9b317f0ee5237eb411ccd526c Mon Sep 17 00:00:00 2001 From: Vitalii Kmit Date: Sun, 16 Aug 2026 21:04:33 +0100 Subject: [PATCH 07/17] Trim input text --- debugging/book-library/script.js | 6 +++++- 1 file changed, 5 insertions(+), 1 deletion(-) diff --git a/debugging/book-library/script.js b/debugging/book-library/script.js index 39603f89a..24e83cedc 100644 --- a/debugging/book-library/script.js +++ b/debugging/book-library/script.js @@ -26,7 +26,11 @@ const addBookBtn = document.getElementById("addBook"); //check the right input from forms and if its ok -> add the new book (object in array) //via Book function and start render function function addBook() { - if (title.value == "" || author.value == "" || pages.value == "") { + if ( + title.value.trim() == "" || + author.value.trim() == "" || + pages.value.trim() == "" + ) { alert("Please fill all fields!"); return false; } else { From 31bfa27a00a888c2bb5fefc7bdc1103aa9e46a8a Mon Sep 17 00:00:00 2001 From: Vitalii Kmit Date: Sun, 16 Aug 2026 21:06:54 +0100 Subject: [PATCH 08/17] Use textContent instead of innerHTML --- debugging/book-library/script.js | 6 +++--- 1 file changed, 3 insertions(+), 3 deletions(-) diff --git a/debugging/book-library/script.js b/debugging/book-library/script.js index 24e83cedc..caf348f53 100644 --- a/debugging/book-library/script.js +++ b/debugging/book-library/script.js @@ -69,9 +69,9 @@ function render() { let pagesCell = row.insertCell(2); let wasReadCell = row.insertCell(3); let deleteCell = row.insertCell(4); - titleCell.innerHTML = myLibrary[i].title; - authorCell.innerHTML = myLibrary[i].author; - pagesCell.innerHTML = myLibrary[i].pages; + titleCell.textContent = myLibrary[i].title; + authorCell.textContent = myLibrary[i].author; + pagesCell.textContent = myLibrary[i].pages; //add and wait for action for read/unread button let changeBut = document.createElement("button"); changeBut.id = i; From 6a4344b5a3a2a96f3324ca6fbe0aa88f68c13aa6 Mon Sep 17 00:00:00 2001 From: Vitalii Kmit Date: Sun, 16 Aug 2026 21:16:04 +0100 Subject: [PATCH 09/17] Make render() more efficient --- debugging/book-library/script.js | 25 +++++++------------------ 1 file changed, 7 insertions(+), 18 deletions(-) diff --git a/debugging/book-library/script.js b/debugging/book-library/script.js index caf348f53..fd91f8b58 100644 --- a/debugging/book-library/script.js +++ b/debugging/book-library/script.js @@ -54,16 +54,12 @@ function Book(title, author, pages, check) { this.check = check; } function render() { - let table = document.getElementById("display"); - let rowsNumber = table.rows.length; - //delete old table - for (let n = rowsNumber - 1; n > 0; n--) { - table.deleteRow(n); - } - //insert updated row and cells + let tbody = document.querySelector("#display tbody"); + tbody.innerHTML = ""; + let length = myLibrary.length; for (let i = 0; i < length; i++) { - let row = table.insertRow(1); + let row = tbody.insertRow(); let titleCell = row.insertCell(0); let authorCell = row.insertCell(1); let pagesCell = row.insertCell(2); @@ -72,25 +68,18 @@ function render() { titleCell.textContent = myLibrary[i].title; authorCell.textContent = myLibrary[i].author; pagesCell.textContent = myLibrary[i].pages; - //add and wait for action for read/unread button + let changeBut = document.createElement("button"); - changeBut.id = i; changeBut.className = "btn btn-success"; wasReadCell.appendChild(changeBut); - let readStatus = ""; - if (myLibrary[i].check) { - readStatus = "Yes"; - } else { - readStatus = "No"; - } + let readStatus = myLibrary[i].check ? "Yes" : "No"; changeBut.innerText = readStatus; changeBut.addEventListener("click", function () { myLibrary[i].check = !myLibrary[i].check; render(); }); - //add delete button to every row and render again + let delBut = document.createElement("button"); - delBut.id = i + 5; deleteCell.appendChild(delBut); delBut.className = "btn btn-warning"; delBut.innerHTML = "Delete"; From 7cd2449d6f761b977c9f18bcf96956b87db990ad Mon Sep 17 00:00:00 2001 From: Vitalii Kmit Date: Sun, 16 Aug 2026 21:28:18 +0100 Subject: [PATCH 10/17] Make variables more consistent --- debugging/book-library/script.js | 22 +++++++++++----------- 1 file changed, 11 insertions(+), 11 deletions(-) diff --git a/debugging/book-library/script.js b/debugging/book-library/script.js index fd91f8b58..b7d15e596 100644 --- a/debugging/book-library/script.js +++ b/debugging/book-library/script.js @@ -69,24 +69,24 @@ function render() { authorCell.textContent = myLibrary[i].author; pagesCell.textContent = myLibrary[i].pages; - let changeBut = document.createElement("button"); - changeBut.className = "btn btn-success"; - wasReadCell.appendChild(changeBut); + let changeButton = document.createElement("button"); + changeButton.className = "btn btn-success"; + wasReadCell.appendChild(changeButton); let readStatus = myLibrary[i].check ? "Yes" : "No"; - changeBut.innerText = readStatus; - changeBut.addEventListener("click", function () { + changeButton.textContent = readStatus; + changeButton.addEventListener("click", function () { myLibrary[i].check = !myLibrary[i].check; render(); }); - let delBut = document.createElement("button"); - deleteCell.appendChild(delBut); - delBut.className = "btn btn-warning"; - delBut.innerHTML = "Delete"; - delBut.addEventListener("click", function () { - alert(`You've deleted title: ${myLibrary[i].title}`); + let deleteButton = document.createElement("button"); + deleteCell.appendChild(deleteButton); + deleteButton.className = "btn btn-warning"; + deleteButton.textContent = "Delete"; + deleteButton.addEventListener("click", function () { myLibrary.splice(i, 1); render(); + alert(`You've deleted title: ${myLibrary[i].title}`); }); } } From c81cdb8e8556ea8c8e4c8bdfbf352e1df941acdd Mon Sep 17 00:00:00 2001 From: Vitalii Kmit Date: Sun, 16 Aug 2026 21:30:00 +0100 Subject: [PATCH 11/17] use const instead of let for non-reassigned variables --- debugging/book-library/script.js | 38 ++++++++++++++++++-------------- 1 file changed, 22 insertions(+), 16 deletions(-) diff --git a/debugging/book-library/script.js b/debugging/book-library/script.js index b7d15e596..ba172d05a 100644 --- a/debugging/book-library/script.js +++ b/debugging/book-library/script.js @@ -6,8 +6,8 @@ window.addEventListener("load", function (e) { function populateStorage() { if (myLibrary.length == 0) { - let book1 = new Book("Robison Crusoe", "Daniel Defoe", 252, true); - let book2 = new Book( + const book1 = new Book("Robison Crusoe", "Daniel Defoe", 252, true); + const book2 = new Book( "The Old Man and the Sea", "Ernest Hemingway", 127, @@ -34,7 +34,7 @@ function addBook() { alert("Please fill all fields!"); return false; } else { - let book = new Book( + const book = new Book( title.value, author.value, Number(pages.value), @@ -54,39 +54,45 @@ function Book(title, author, pages, check) { this.check = check; } function render() { - let tbody = document.querySelector("#display tbody"); + const tbody = document.querySelector("#display tbody"); tbody.innerHTML = ""; - let length = myLibrary.length; + const length = myLibrary.length; for (let i = 0; i < length; i++) { - let row = tbody.insertRow(); - let titleCell = row.insertCell(0); - let authorCell = row.insertCell(1); - let pagesCell = row.insertCell(2); - let wasReadCell = row.insertCell(3); - let deleteCell = row.insertCell(4); + const row = tbody.insertRow(); + const titleCell = row.insertCell(0); + const authorCell = row.insertCell(1); + const pagesCell = row.insertCell(2); + const wasReadCell = row.insertCell(3); + const deleteCell = row.insertCell(4); titleCell.textContent = myLibrary[i].title; authorCell.textContent = myLibrary[i].author; pagesCell.textContent = myLibrary[i].pages; - let changeButton = document.createElement("button"); + const changeButton = document.createElement("button"); changeButton.className = "btn btn-success"; wasReadCell.appendChild(changeButton); - let readStatus = myLibrary[i].check ? "Yes" : "No"; + let readStatus; + if (myLibrary[i].check) { + readStatus = "Yes"; + } else { + readStatus = "No"; + } changeButton.textContent = readStatus; changeButton.addEventListener("click", function () { myLibrary[i].check = !myLibrary[i].check; render(); }); - let deleteButton = document.createElement("button"); + const deleteButton = document.createElement("button"); deleteCell.appendChild(deleteButton); deleteButton.className = "btn btn-warning"; - deleteButton.textContent = "Delete"; deleteButton.addEventListener("click", function () { + const deletedTitle = myLibrary[i].title; myLibrary.splice(i, 1); render(); - alert(`You've deleted title: ${myLibrary[i].title}`); + alert(`You've deleted title: ${deletedTitle}`); }); + deleteButton.textContent = "Delete"; } } From 03672e3ff942e2b6aa62ca600c554d375c268905 Mon Sep 17 00:00:00 2001 From: Vitalii Kmit Date: Sun, 16 Aug 2026 21:33:11 +0100 Subject: [PATCH 12/17] refactor: clean up script.js per code review feedback - Rename DOM reference variables to signal element type (titleInput, authorInput, pagesInput, checkInput) - Change myLibrary from let to const - Trim title/author before storing, not just validating - Reject non-numeric and non-positive page counts - Replace blocking window.alert() with non-blocking showMessage() banner for delete confirmation --- debugging/book-library/script.js | 47 ++++++++++++++++++++++---------- 1 file changed, 32 insertions(+), 15 deletions(-) diff --git a/debugging/book-library/script.js b/debugging/book-library/script.js index ba172d05a..6c3f22b5c 100644 --- a/debugging/book-library/script.js +++ b/debugging/book-library/script.js @@ -1,4 +1,5 @@ -let myLibrary = []; +const myLibrary = []; + window.addEventListener("load", function (e) { populateStorage(); render(); @@ -17,28 +18,35 @@ function populateStorage() { myLibrary.push(book2); } } -const title = document.getElementById("title"); -const author = document.getElementById("author"); -const pages = document.getElementById("pages"); -const check = document.getElementById("check"); + +const titleInput = document.getElementById("title"); +const authorInput = document.getElementById("author"); +const pagesInput = document.getElementById("pages"); +const checkInput = document.getElementById("check"); const addBookBtn = document.getElementById("addBook"); //check the right input from forms and if its ok -> add the new book (object in array) //via Book function and start render function function addBook() { + const cleanTitle = titleInput.value.trim(); + const cleanAuthor = authorInput.value.trim(); + const pageCount = Number(pagesInput.value); + if ( - title.value.trim() == "" || - author.value.trim() == "" || - pages.value.trim() == "" + cleanTitle == "" || + cleanAuthor == "" || + pagesInput.value.trim() == "" || + Number.isNaN(pageCount) || + pageCount <= 0 ) { - alert("Please fill all fields!"); + alert("Please fill all fields correctly!"); return false; } else { const book = new Book( - title.value, - author.value, - Number(pages.value), - check.checked + cleanTitle, + cleanAuthor, + pageCount, + checkInput.checked ); myLibrary.push(book); render(); @@ -53,6 +61,15 @@ function Book(title, author, pages, check) { this.pages = pages; this.check = check; } + +function showMessage(text) { + const msg = document.createElement("div"); + msg.className = "alert alert-info"; + msg.textContent = text; + document.body.prepend(msg); + setTimeout(() => msg.remove(), 3000); +} + function render() { const tbody = document.querySelector("#display tbody"); tbody.innerHTML = ""; @@ -87,12 +104,12 @@ function render() { const deleteButton = document.createElement("button"); deleteCell.appendChild(deleteButton); deleteButton.className = "btn btn-warning"; + deleteButton.textContent = "Delete"; deleteButton.addEventListener("click", function () { const deletedTitle = myLibrary[i].title; myLibrary.splice(i, 1); render(); - alert(`You've deleted title: ${deletedTitle}`); + showMessage(`You've deleted title: ${deletedTitle}`); }); - deleteButton.textContent = "Delete"; } } From 026b2afa7ac7f8e378df321b54f1c4afd50ec60a Mon Sep 17 00:00:00 2001 From: Vitalii Kmit Date: Mon, 17 Aug 2026 20:43:35 +0100 Subject: [PATCH 13/17] Declare variables at the top of the file --- debugging/book-library/script.js | 16 ++++++++-------- 1 file changed, 8 insertions(+), 8 deletions(-) diff --git a/debugging/book-library/script.js b/debugging/book-library/script.js index 6c3f22b5c..d445db2fb 100644 --- a/debugging/book-library/script.js +++ b/debugging/book-library/script.js @@ -1,5 +1,13 @@ const myLibrary = []; +const titleInput = document.getElementById("title"); +const authorInput = document.getElementById("author"); +const pagesInput = document.getElementById("pages"); +const checkInput = document.getElementById("check"); +const addBookBtn = document.getElementById("addBook"); + +addBookBtn.addEventListener("click", addBook); + window.addEventListener("load", function (e) { populateStorage(); render(); @@ -19,12 +27,6 @@ function populateStorage() { } } -const titleInput = document.getElementById("title"); -const authorInput = document.getElementById("author"); -const pagesInput = document.getElementById("pages"); -const checkInput = document.getElementById("check"); -const addBookBtn = document.getElementById("addBook"); - //check the right input from forms and if its ok -> add the new book (object in array) //via Book function and start render function function addBook() { @@ -53,8 +55,6 @@ function addBook() { } } -addBookBtn.addEventListener("click", addBook); - function Book(title, author, pages, check) { this.title = title; this.author = author; From 652519640ed2199332607140a2441ae574017fe5 Mon Sep 17 00:00:00 2001 From: Vitalii Kmit Date: Mon, 17 Aug 2026 20:46:14 +0100 Subject: [PATCH 14/17] Check for decimal numbers --- debugging/book-library/script.js | 1 + 1 file changed, 1 insertion(+) diff --git a/debugging/book-library/script.js b/debugging/book-library/script.js index d445db2fb..5b807bfce 100644 --- a/debugging/book-library/script.js +++ b/debugging/book-library/script.js @@ -39,6 +39,7 @@ function addBook() { cleanAuthor == "" || pagesInput.value.trim() == "" || Number.isNaN(pageCount) || + !Number.isInteger(pageCount) || pageCount <= 0 ) { alert("Please fill all fields correctly!"); From a58e76e88cc9b3689997b478910112e06ca55e1c Mon Sep 17 00:00:00 2001 From: Vitalii Kmit Date: Mon, 17 Aug 2026 20:47:33 +0100 Subject: [PATCH 15/17] Use ternary operator --- debugging/book-library/script.js | 7 +------ 1 file changed, 1 insertion(+), 6 deletions(-) diff --git a/debugging/book-library/script.js b/debugging/book-library/script.js index 5b807bfce..8d8082c7c 100644 --- a/debugging/book-library/script.js +++ b/debugging/book-library/script.js @@ -90,12 +90,7 @@ function render() { const changeButton = document.createElement("button"); changeButton.className = "btn btn-success"; wasReadCell.appendChild(changeButton); - let readStatus; - if (myLibrary[i].check) { - readStatus = "Yes"; - } else { - readStatus = "No"; - } + let readStatus = myLibrary[i].check ? "Yes" : "No"; changeButton.textContent = readStatus; changeButton.addEventListener("click", function () { myLibrary[i].check = !myLibrary[i].check; From 12ccc8d90d8647758c9aebeb8ce58cd3b623be78 Mon Sep 17 00:00:00 2001 From: Vitalii Kmit Date: Mon, 17 Aug 2026 20:59:50 +0100 Subject: [PATCH 16/17] Use form to enable validation --- debugging/book-library/index.html | 93 ++++++++++++++++--------------- debugging/book-library/script.js | 12 +++- 2 files changed, 59 insertions(+), 46 deletions(-) diff --git a/debugging/book-library/index.html b/debugging/book-library/index.html index 2090f28f1..03a1c30f6 100644 --- a/debugging/book-library/index.html +++ b/debugging/book-library/index.html @@ -21,53 +21,56 @@

Library

-
-
- - - - - - -
+ diff --git a/debugging/book-library/script.js b/debugging/book-library/script.js index 8d8082c7c..d06994091 100644 --- a/debugging/book-library/script.js +++ b/debugging/book-library/script.js @@ -6,7 +6,17 @@ const pagesInput = document.getElementById("pages"); const checkInput = document.getElementById("check"); const addBookBtn = document.getElementById("addBook"); -addBookBtn.addEventListener("click", addBook); +document.querySelector("form").addEventListener("submit", (e) => { + e.preventDefault(); + + const form = e.target; + if (!form.checkValidity()) { + form.reportValidity(); + return; + } + + addBook(); +}); window.addEventListener("load", function (e) { populateStorage(); From 2473edb7e355ea4f01122262899d541b7ba2e26e Mon Sep 17 00:00:00 2001 From: Vitalii Kmit Date: Mon, 17 Aug 2026 21:00:20 +0100 Subject: [PATCH 17/17] Remove dead code --- debugging/book-library/script.js | 1 - 1 file changed, 1 deletion(-) diff --git a/debugging/book-library/script.js b/debugging/book-library/script.js index d06994091..ae346724e 100644 --- a/debugging/book-library/script.js +++ b/debugging/book-library/script.js @@ -4,7 +4,6 @@ const titleInput = document.getElementById("title"); const authorInput = document.getElementById("author"); const pagesInput = document.getElementById("pages"); const checkInput = document.getElementById("check"); -const addBookBtn = document.getElementById("addBook"); document.querySelector("form").addEventListener("submit", (e) => { e.preventDefault();