I In here I am trying to achieve if the search.Response returns true i want to display search results for " search term " otherwise it should returns No search results were found “search term”. However, it returns No search results were found “search term” on both instances.
Can you show the results of:
console.log(search.Response);
console.log(typeof search.Response);
Thanks for reply. In both cases it returned undefined.
Well then, that’s your problem. Can you log out what search is?
Do you see the structure of your data?
search.Response isn’t the valid property to access that True value. 
Thanks for reply. From what I understand it should be search.result.Response === “True” to access the Response but it thrown exception : Uncaught (in promise) TypeError: Cannot read property ‘Response’ of undefined
This is different than what is in your screenshot from the first post. 
I know it’s different but I also tried accessing the Response property like this search.result.Response and it still throws error like cannot property of Response.
What I don’t understand is why your console output is preceded with “Search”. Is your console statement:
console.log('Search', search);
If that’s the case, then the basic shape of your data is:
{
query: 'deadpool',
result: {
Response: 'True',
Search: [
{ Title: 'Deadpool' /* etc. */ },
{ Title: 'Deadpool 2' /* etc. */ },
// etc.
],
},
}
If that is the case, then your if statement should be right at search.result.response.
But this is async data so it all depends on when and where you access it. As Randy suggested, you need to tell us exactly what it is right before that if statement. I would want you to insert:
console.log('search JSON is ->', JSON.stringify(search, null, 2));
console.log('typeof search is ->', typeof search);
so that your code looks like:
export const searchQuery = search => {
console.log('search JSON is ->', JSON.stringify(search, null, 2));
console.log('typeof search is ->', typeof search);
if (search.Response) {
// etc.
Do it exactly like that. And show us the result and show us the exact code that is logging it out. You don’t have to take a picture, you can just cut and paste.
If that doesn’t solve your problem , then you will need to provide a link to a pen or repo or something. We need to see more to figure out what is going on. You can’t expect the mechanic to tell what is wrong with your car if he can only see 4 square inches of the engine in a dimly lit room.
Again, I think there is one of two problems going on here:
Thanks for reply Kevin. Search is an object that has two properties including search query and result which contains API call response.
I have inserted this code :
console.log('search JSON is ->', JSON.stringify(search, null, 2)); console.log('typeof search is ->', typeof search);
Output:
search JSON is -> "deadpool"
searchView.js:59 typeof search is -> string
searchView.js:58 search JSON is -> {
"query": "deadpool",
"result": {
"Search": [
{
"Title": "Deadpool",
"Year": "2016",
"imdbID": "tt1431045",
"Type": "movie",
"Poster": "https://m.media-amazon.com/images/M/MV5BYzE5MjY1ZDgtMTkyNC00MTMyLThhMjAtZGI5OTE1NzFlZGJjXkEyXkFqcGdeQXVyNjU0OTQ0OTY@._V1_SX300.jpg"
},
{
"Title": "Deadpool 2",
"Year": "2018",
"imdbID": "tt5463162",
"Type": "movie",
"Poster": "https://m.media-amazon.com/images/M/MV5BNjk1Njk3YjctMmMyYS00Y2I4LThhMzktN2U0MTMyZTFlYWQ5XkEyXkFqcGdeQXVyODM2ODEzMDA@._V1_SX300.jpg"
},
{
"Title": "Deadpool: No Good Deed",
"Year": "2017",
"imdbID": "tt6612630",
"Type": "movie",
"Poster": "https://m.media-amazon.com/images/M/MV5BODAxNDFhNGItMzdiMC00NDM1LWExYWUtZjNiMGIzYTc0MTM5XkEyXkFqcGdeQXVyMjYzMjA3NzI@._V1_SX300.jpg"
},
{
"Title": "Gettin' Wet on Wet with Deadpool 2",
"Year": "2017",
"imdbID": "tt7636826",
"Type": "movie",
"Poster": "https://m.media-amazon.com/images/M/MV5BNTUwMTBhY2ItM2VhMC00M2ZmLWE1MjItYTI4ZTM1NWU4MGVkXkEyXkFqcGdeQXVyNDE4OTY5NzI@._V1_SX300.jpg"
},
{
"Title": "Deadpool: A Typical Tuesday",
"Year": "2012",
"imdbID": "tt2153366",
"Type": "movie",
"Poster": "https://m.media-amazon.com/images/M/MV5BNzhjZjU2MzEtNmM1Yi00MmE5LWI2ODItOWNjOTZjMzFmOTU4XkEyXkFqcGdeQXVyNTA0OTU0OTQ@._V1_SX300.jpg"
},
{
"Title": "Deadpool: The Musical 2",
"Year": "2018",
"imdbID": "tt8686240",
"Type": "movie",
"Poster": "https://m.media-amazon.com/images/M/MV5BYzAwNTVlNGMtMWRiZC00MWM4LWEwYzItZTgxNDMxN2U2NzY3XkEyXkFqcGdeQXVyNjE3MzA4OQ@@._V1_SX300.jpg"
},
{
"Title": "Deadpool The Musical: Beauty and the Beast Gaston Parody",
"Year": "2017",
"imdbID": "tt6693444",
"Type": "movie",
"Poster": "https://m.media-amazon.com/images/M/MV5BYzEyOTU1MDYtZjg3ZS00OWE1LWIwYTMtN2E4OTA1MzE5MmY3XkEyXkFqcGdeQXVyMTkyNzc0MA@@._V1_SX300.jpg"
},
{
"Title": "Deadpool: From Comics to Screen... to Screen",
"Year": "2016",
"imdbID": "tt5852644",
"Type": "movie",
"Poster": "https://m.media-amazon.com/images/M/MV5BMTljZTM5YzctZDc0My00YmQ4LWFjNjAtYmE2ZjJiNGFjNmEyXkEyXkFqcGdeQXVyMjQ5NjgwMjA@._V1_SX300.jpg"
},
{
"Title": "Deadpool & Black Panther: The Gauntlet",
"Year": "2016",
"imdbID": "tt4529214",
"Type": "movie",
"Poster": "https://m.media-amazon.com/images/M/MV5BMTg2MTI1ODMzNl5BMl5BanBnXkFtZTgwNTgxMjY4NjE@._V1_SX300.jpg"
},
{
"Title": "Deadpool and the Black Panther",
"Year": "2014",
"imdbID": "tt4063610",
"Type": "movie",
"Poster": "https://m.media-amazon.com/images/M/MV5BMjA0OTg1NDEyMV5BMl5BanBnXkFtZTgwNzY4NjU2MzE@._V1_SX300.jpg"
}
],
"totalResults": "28",
"Response": "True"
}
}
searchView.js:59 typeof search is -> object
OK, but that output doesn’t make sense with what you’ve posted as the console.log statements you have. Please post the following:
export const searchQuery = search => {
console.log('search JSON is ->', JSON.stringify(search, null, 2));
console.log('typeof search is ->', typeof search);
if (search.result.Response === 'True') {
const markUp = `
<div class="movie__searched">
<h1>search results for “${search.query}”</h1>
</div>
`;
elements.searchResList.insertAdjacentHTML('afterbegin', markUp);
} else {
const markUp = `
<div class="movie__searched">
<h1>No search results for “${search.query}”</h1>
</div>
`;
elements.searchResList.insertAdjacentHTML('afterbegin', markUp);
}
}
I get this error when I try to acces the “Response” property like search.Response Otherwise if I access search.result.Response I get the same output as my last reply.
searchView.js:60 Uncaught (in promise) TypeError: Cannot read property 'Response' of undefined
at Module.searchQuery (searchView.js:60)
at _callee$ (index.js:45)
at tryCatch (runtime.js:63)
at Generator.invoke [as _invoke] (runtime.js:293)
at Generator.eval [as next] (runtime.js:118)
at asyncGeneratorStep (index.js:20)
at _next (index.js:22)
at eval (index.js:22)
at new Promise (<anonymous>)
at eval (index.js:22)
This is how my search class is structured:
export default class Search {
constructor(query) {
this.query = query
}
async getResults() {
const apiKey = '#########';
const proxy = 'http://cors-anywhere.herokuapp.com/';
try {
const res = await axios(`${proxy}http://www.omdbapi.com/?apikey=${apiKey}&s=${this.query}&type=movie`);
this.result = res.data;
} catch (error) {
console.log(error);
}
}
}
I’ve edited your post for readability. When you enter a code block into a forum post, please precede it with a separate line of three backticks and follow it with a separate line of three backticks to make it easier to read.
You can also use the “preformatted text” tool in the editor (</>) to add backticks around text.
See this post to find the backtick on your keyboard.
Note: Backticks (`) are not single quotes (’).
OK, but how and when is searchQuery being called. Can you make a repo for this so we can see what is going on?
I call this searchQuery method in my controller class after getting movie data from API call. I hope I make sense.
//2-CREATE SEARCH OBJECT
state.search = new Search(query);
//3-PREPARE UI FOR RESULTS LIKE LOADER AND CLEAR SEARCH INPUT
searchView.clearInput();
searchView.clearResult();
renderLoader(elements.searchResList);
try {
//4-SEARCH FOR MOVIES
await state.search.getResults();
//5-RENDER the results on UI
clearLoader();
searchView.searchQuery(state.search);
searchView.renderResults(state.search.result);
} catch (error) {
console.log(error)
}
OK, another layer to the onion. I would really rather you put this in a repo so we can see everything.
OK, so you have a class that you are instantiating on:
state.search = new Search(query);
On that class you are calling the method _ getResults_. That is getting an asynchronous result back, and dotting into that with res.data and storing that on the class property result.
So, back in your try block, you are passing the entire class with:
searchView.searchQuery(state.search);
Did you want to pass the entire class? I would expect to just pass that stored result as state.search.result. But OK.
So you should be able to access that as search.result.Response.
What I don’t understand is how you can show us an object that you’re getting and at the same time. This:
Cannot read property 'Response' of undefined
is telling us that search.result is undefined. That does not jive with the JSON output you are displaying. It can’t be defined and undefined and the same time.
This statement:
I get this error when I try to acces the “Response” property like search.Response
Otherwise if I access search.result.Response I get the same output as my last reply.
doesn’t make sense, those two lines are arguing with each other. If the first line is true, then that means that search is undefined. But if that is true, then the second line can’t be true. Those two lines are mutually exclusive.
I can’t speak for everyone, but for me, I feel like I’ve reached and endpoint. There are too many things that you are saying that don’t line up. If you want my help, you will need to put this in a repo and provide the link. If there is an API key, you can PM that. If you do that, I can help you. Without that, I don’t think there’s anything more I can do.
Thank you for sharing the link to your repository. Allow me a few minutes to clone it to my local machine and spin it up.
A couple of notes while this loads:
.env file to keep your secrets secret.node_modules folder to a repository. This is a lot of data that slows down the clone/fork process.
This is what I am seeing in the console:
From what I can tell… in this function search is the value of the query parameter. I am not seeing where that query gets passed into an actual HTTP request. 