Already checked other posts about this but didnt resolve my problem. I pass an ID from an html view file to another and use it to get the data in JSON format and assign it to a variable.
The variable gets the data correctly, but when I try to access it, its seems to be undefined; I know this by making console.logs
console.log("Este es un log de singleView.")
const SEARCHAPI = "https://api.themoviedb.org/3/search/movie?&api_key=41ee980e4b5f05f6693fda00eb7c4fd4&query=";
const IMG_PATH = "https://image.tmdb.org/t/p/w1280";
let string = window.location.href;
console.log("String:")
console.log(string)
let indexStart = string.indexOf('?ID=');
indexStart += 4;
let movieId = string.slice(indexStart);
let apiString = "https://api.themoviedb.org/3/movie/" + movieId + "?api_key=41ee980e4b5f05f6693fda00eb7c4fd4";
console.log(movieId)
console.log(apiString)
async function getJson()
{
const requestURL = apiString;
const request = new Request(requestURL);
const response = await fetch(request);
const jsonMovieData = await response.json();
return jsonMovieData;
}
const data = getJson();
console.log(data)
let titleName = data.original_title;
let imageUrl = IMG_PATH + data.poster_path;
let descriptionDetails = data.overview;
let dateFormat = data.release_date;
console.log("CONSOLE DE DATOS:")
console.log(data.original_title)
console.log(data.poster_path)
console.log(data.overview)
console.log(data.release_date)
console.log("DATOS PUROS.")
console.log("VARIABLES:")
console.log(titleName)
console.log(imageUrl)
console.log(descriptionDetails)
console.log(dateFormat)
const singleViewTitleDiv = document.getElementById("movieNameSingleView");
const singleViewImageDiv = document.getElementById("imageSingleView");
const singleViewDescriptionDiv = document.getElementById("detailsSingleView");
const titleElement = document.createElement('h2');
const imageElement = document.createElement('img');
const overviewElement = document.createElement('p');
const dateElement = document.createElement('p');
const breakElement = document.createElement('br');
titleElement.innerHTML = "MOVIE: " + titleName;
titleElement.setAttribute('style', 'color: white');
imageElement.src = imageUrl;
imageElement.setAttribute('width', 600);
overviewElement.innerHTML = descriptionDetails;
overviewElement.setAttribute('style', 'color: white');
dateElement.innerHTML = "RELEASE DATE: " + dateFormat;
dateElement.setAttribute('style', 'color: white');
singleViewTitleDiv.appendChild(titleElement);
singleViewImageDiv.appendChild(imageElement);
singleViewDescriptionDiv.appendChild(dateElement);
singleViewDescriptionDiv.appendChild(breakElement);
singleViewDescriptionDiv.appendChild(overviewElement);
CLICK TO SEE IMAGE: Everything seems to be undefined.
CLICK TO SEE IMAGE: I dont understand why if the JSON is accessed correctly