Lections/upas-web-site
2
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Fix ugly buttons

Browse Source
This commit is contained in:
Aleksey Filippov 2024-11-07 10:46:38 +04:00
parent 1812d3bbef
commit 06e33c19c4
1 changed files with 24 additions and 13 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

37
page-js.html
View File

@ -82,32 +82,43 @@
}
const data = await response.json();
data.forEach((element) => {
const createTh = (value) => {
const th = document.createElement("th");
th.setAttribute("scope", "row");
th.innerText = value;
return th;
};
const createTd = (value) => {
const td = document.createElement("td");
td.innerText = value;
return td;
};
const createButton = (text, type, action) => {
const btn = document.createElement("button");
btn.setAttribute("type", "button");
btn.classList.add("btn", type);
btn.innerHTML = text;
btn.addEventListener("click", action);
const td = document.createElement("td");
td.appendChild(btn);
return td;
};
const container = document.createElement("tr");
const id = document.createElement("th");
id.setAttribute("scope", "row");
id.innerText = element.id;
container.appendChild(id);
container.classList.add("align-middle");
container.appendChild(createTh(element.id));
container.appendChild(createTd(element.last_name));
container.appendChild(createTd(element.first_name));
container.appendChild(createTd(element.bdate));
container.appendChild(createTd(element.email));
container.appendChild(createTd(element.phone));
container.appendChild(createTd(element.group.name));
const btn = document.createElement("button");
btn.setAttribute("type", "button");
btn.classList.add("btn", "btn-danger");
btn.innerHTML = "Delete";
container.appendChild(btn);
btn.addEventListener("click", async () => {
await deleteStudent(element.id);
getStudents();
});
container.appendChild(
createButton("Delete", "btn-danger", async () => {
await deleteStudent(element.id);
getStudents();
})
);
students.appendChild(container);
});
console.log(data);