BookManagement.github.io/borrow.js at main · NegasaReta/BookManagement.github.io · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
let studentName = document.querySelector(".name");
let studentId = document.querySelector(".id");
let book = document.querySelector(".book");
let phoneNumber = document.querySelector(".phone");
let borrowBtn = document.querySelector(".borrow-btn");
let verifyName = document.querySelector(".verify_name");
let verifyId = document.querySelector(".verify_id");
let verifyPhone = document.querySelector(".verify_phone");
let verifybook = document.querySelector(".verify_book");
let verifiactionModal= document.querySelector(".verifiaction");
let backDrop = document.querySelector(".back-drop");

borrowBtn.addEventListener("click",(e)=>{

    verifiactionModal.style.display="grid";
    backDrop.style.display="block";
    backDrop.style.opacity ="1";

   if (studentName.value.length===0) {
       verifyName.innerHTML= `Name: empty`;
    } else {
       verifyName.innerHTML= `Name: ${studentName.value}`;
   }

   if (studentId.value.length===0) {
       verifyId.innerHTML= `Id: empty`;
    } else {
       verifyId.innerHTML= `Id: ${studentId.value}`;
   }
   if (phoneNumber.value.length===0) {
       verifyPhone.innerHTML= `Phone: empty`;
    } else {
       verifyPhone.innerHTML= `Phone: ${phoneNumber.value}`;
   }
   if (book.value.length===0) {
       verifybook.innerHTML= `Book: empty`;
    } else {
       verifybook.innerHTML= `Book: ${book.value}`;
   }

})


backDrop.addEventListener("click",()=>{
       backDrop.style.display="none";
        verifiactionModal.style.display ="none";


})