veebikoolitus-2018-03-live/app.js

42 lines
950 B
JavaScript
Raw Normal View History

2018-03-22 18:37:27 +02:00
"use strict";
2018-03-22 18:37:55 +02:00
2018-03-22 18:37:59 +02:00
console.log("App");
2018-03-22 18:42:28 +02:00
2018-03-22 18:45:03 +02:00
let addForm = document.getElementById("addFormElement");
2018-03-22 18:50:38 +02:00
addForm.addEventListener("submit", addBook);
2018-03-22 18:45:03 +02:00
2018-03-22 18:56:14 +02:00
let bookTable = document.getElementById("bookTableBody");
2018-03-22 19:11:31 +02:00
let lastBookId = 0;
function genBookId() {
return lastBookId++;
}
2018-03-22 18:50:38 +02:00
function addBook(event){
event.preventDefault();
2018-03-22 18:52:33 +02:00
console.log("Add Book", event.target.bookTitle.value);
2018-03-22 19:12:04 +02:00
let bookId = genBookId();
2018-03-22 19:03:59 +02:00
let row = `
2018-03-22 19:14:23 +02:00
<tr id="bookRow${bookId}">
2018-03-22 19:12:34 +02:00
<td>${bookId + 1}</td>
2018-03-22 19:08:16 +02:00
<td>${event.target.bookTitle.value}</td>
2018-03-22 19:09:50 +02:00
<td>${event.target.bookGenre.value}</td>
<td>${event.target.bookDesc.value}</td>
2018-03-22 19:03:59 +02:00
<td>
2018-03-22 19:16:54 +02:00
<button onclick="deleteBook(${bookId})">Edit</button>
2018-03-22 19:03:59 +02:00
<button>Delete</button>
</td>
</tr>
`
2018-03-22 19:06:00 +02:00
bookTable.innerHTML = bookTable.innerHTML + row;
2018-03-22 18:42:28 +02:00
}
function deleteBook() {
console.log("Delete Book");
}
function editBook() {
console.log("Edit book");
}