37 lines
1.6 KiB
JavaScript
37 lines
1.6 KiB
JavaScript
|
const button = document.getElementById("gomb")
|
||
|
|
const kiiras = document.getElementById("etelek")
|
||
|
|
|
||
|
|
button.addEventListener("click", () => {
|
||
|
|
const etel = document.querySelector("select").selectedIndex
|
||
|
|
let xhttp = new XMLHttpRequest()
|
||
|
|
xhttp.open("GET", "http://localhost:5500/Feladat1/receptek.json", true)
|
||
|
|
|
||
|
|
xhttp.onreadystatechange = function() {
|
||
|
|
if (xhttp.readyState === 4) {
|
||
|
|
if (xhttp.status === 200) {
|
||
|
|
const valasztottEtel = JSON.parse(xhttp.responseText)[etel]
|
||
|
|
|
||
|
|
const nev = document.createElement("span")
|
||
|
|
const elkeszitesiIdo = document.createElement("span")
|
||
|
|
const hozzavalok = document.createElement("span")
|
||
|
|
const tapertek = document.createElement("span")
|
||
|
|
|
||
|
|
const tapertekObject = valasztottEtel["Tápérték"]
|
||
|
|
|
||
|
|
nev.innerHTML = `<b>Név</b>: ${valasztottEtel["nev"]}<br>`
|
||
|
|
elkeszitesiIdo.innerHTML = `<b>Elkészítési idő</b>: ${valasztottEtel["elkeszitesiIdo"]}<br>`
|
||
|
|
hozzavalok.innerHTML = `<b>Hozzávalók</b>: ${valasztottEtel["hozzávalók"].join(", ")}<br>`
|
||
|
|
tapertek.innerHTML = `<b>Tápérték</b>: ${tapertekObject["energia"]}, ${tapertekObject["fehérje"]}, ${tapertekObject["szénhidrát"]}, ${tapertekObject["zsír"]}<br><br>`
|
||
|
|
|
||
|
|
kiiras.appendChild(nev)
|
||
|
|
kiiras.appendChild(elkeszitesiIdo)
|
||
|
|
kiiras.appendChild(hozzavalok)
|
||
|
|
kiiras.appendChild(tapertek)
|
||
|
|
} else {
|
||
|
|
console.log(`Hiba történt: ${xhttp.status}`);
|
||
|
|
}
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
xhttp.send()
|
||
|
|
})
|