58 lines
1.9 KiB
HTML
58 lines
1.9 KiB
HTML
<!DOCTYPE html>
|
|
<html lang="en">
|
|
<head>
|
|
<meta charset="UTF-8">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
<title>Document</title>
|
|
</head>
|
|
<body>
|
|
<form>
|
|
Cím: <input type="text" id="title"> <br>
|
|
Id: <input type="number" id="id"> <br>
|
|
Befejezett: <input type="checkbox" id="completed" value="0"> <br>
|
|
</form>
|
|
<button id="bekuld">Beküld</button>
|
|
<div id="todos"></div>
|
|
<script>
|
|
let url = "https://jsonplaceholder.typicode.com/todos";
|
|
document.getElementById("bekuld").addEventListener("click", function (){
|
|
let cim = document.getElementById("title").value;
|
|
let identification = document.getElementById("id").value;
|
|
let completed = document.getElementById("completed").checked;
|
|
|
|
fetch(url, {
|
|
method: 'POST',
|
|
headers: {
|
|
'Content-Type': 'application/json',
|
|
},
|
|
body: JSON.stringify({
|
|
id: identification,
|
|
title: cim,
|
|
completed: completed
|
|
}),
|
|
})
|
|
.then(response => response.json())
|
|
.then(data => {
|
|
let divelement = document.createElement("div");
|
|
let cim = document.createElement("h2");
|
|
cim.innerHTML = data.title;
|
|
|
|
let asd = document.createElement("p");
|
|
asd.innerHTML = `Az elem azonosítója: ${data.id} <br>
|
|
Az elem befejezésének állapota: ${data.completed ? "befejezve" : "nem befejezett"}`;
|
|
|
|
divelement.appendChild(cim);
|
|
divelement.appendChild(asd);
|
|
|
|
document.getElementById("todos").appendChild(divelement);
|
|
|
|
});
|
|
|
|
|
|
});
|
|
|
|
|
|
|
|
</script>
|
|
</body>
|
|
</html> |