Compare commits
2 Commits
8cfb75b8d5
...
12e5b11ab4
Author | SHA1 | Date |
---|---|---|
Mick877 | 12e5b11ab4 | |
Mick877 | c6f96fbf15 |
|
@ -0,0 +1,17 @@
|
||||||
|
<!DOCTYPE html>
|
||||||
|
<html lang="it" dir="ltr">
|
||||||
|
<head>
|
||||||
|
<meta charset="utf-8">
|
||||||
|
<title>Form Fetch API</title>
|
||||||
|
<script src="fetch-form-api.js" charset="utf-8"></script>
|
||||||
|
</head>
|
||||||
|
<body>
|
||||||
|
<p>Inserisci una valuta per ottenere i tassi di cambio con l'Euro</p>
|
||||||
|
<form id="form">
|
||||||
|
<input type="text" id="currency" placeholder="Valuta">
|
||||||
|
<input type="submit" value="Converti">
|
||||||
|
</form>
|
||||||
|
<hr>
|
||||||
|
<h2 id="exchange-result"></h2>
|
||||||
|
</body>
|
||||||
|
</html>
|
|
@ -0,0 +1,30 @@
|
||||||
|
function getJSON(response){
|
||||||
|
let data = response.json();
|
||||||
|
return data
|
||||||
|
}
|
||||||
|
|
||||||
|
function getCurrencyRate(currency){
|
||||||
|
console.log(currency);
|
||||||
|
let url = "https://api.exchangeratesapi.io/latest?symbols=" + currency;
|
||||||
|
fetch(url)
|
||||||
|
.then(getJSON)
|
||||||
|
.then(data => {
|
||||||
|
console.log("Data : " ,data)
|
||||||
|
let rate = Object.values(data.rates)[0];
|
||||||
|
document.querySelector("#exchange-result").innerHTML = `1.00 Euro corrisponde a ${rate} ${currency}`;
|
||||||
|
})
|
||||||
|
.catch( err => {
|
||||||
|
// console.log("Errore : ", err)
|
||||||
|
document.querySelector("#exchange-result").innerHTML = `Errore ${err}`;
|
||||||
|
})
|
||||||
|
}
|
||||||
|
document.addEventListener("DOMContentLoaded", () =>{
|
||||||
|
document.querySelector("#form").onsubmit = event =>{
|
||||||
|
event.preventDefault();
|
||||||
|
|
||||||
|
const currency = document.querySelector("#currency").value;
|
||||||
|
getCurrencyRate(currency)
|
||||||
|
|
||||||
|
document.querySelector("#currency").value = "";
|
||||||
|
}
|
||||||
|
})
|
Loading…
Reference in New Issue