bif/java-movieservice
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

Add alert box which does another request to HTML

Browse Source
This commit is contained in:
karl 2019-12-10 15:18:02 +01:00
parent a6f24dbbc2
commit 9e237adc19
1 changed files with 20 additions and 9 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

29
MoviesClient/web/index.html
View File

@ -9,28 +9,39 @@
const MOVIES_RESOURCE_URL = "http://localhost:8080/movieservice/resources/movie"; const MOVIES_RESOURCE_URL = "http://localhost:8080/movieservice/resources/movie";
let loadNews = function () { const options = {
let options = { mode: "cors",
mode: "cors", headers: {
headers: { "Accept": "application/json",
"Accept": "application/json", "Authorization": "Basic " + btoa("moviesuser:topsecret")
"Authorization": "Basic " + btoa("moviesuser:topsecret") }
} };
};
let loadNews = function () {
// Studios: ID dranhängen -> 2. Aufruf -> Alert dranhängen // Studios: ID dranhängen -> 2. Aufruf -> Alert dranhängen
fetch(MOVIES_RESOURCE_URL, options) fetch(MOVIES_RESOURCE_URL, options)
.then(response => response.json()) .then(response => response.json())
.then(function (moviesList) { .then(function (moviesList) {
let html = moviesList.map(movie => let html = moviesList.map(movie =>
`<h2>${movie.title}</h2> `<h2>${movie.title}</h2>
<p>${movie.description}</p>`) <p>${movie.description}</p>
<button onclick="displayDetails(${movie.id})">Get more info</button>`)
.join(""); .join("");
document.getElementById("content").innerHTML = html; document.getElementById("content").innerHTML = html;
}) })
.catch(error => document.getElementById("content").innerHTML = `Error: ${error}`); .catch(error => document.getElementById("content").innerHTML = `Error: ${error}`);
}; };
let displayDetails = function (id) {
fetch(MOVIES_RESOURCE_URL + "/" + id, options) // TODO: Ugly URL building
.then(response => response.json())
.then(function (movie) {
alert(movie.length)
})
.catch(error => document.getElementById("content").innerHTML = `Error: ${error}`);
};
document.addEventListener("DOMContentLoaded", loadNews); document.addEventListener("DOMContentLoaded", loadNews);
</script> </script>
</head> </head>