Having a problem in Wikipedia api while using async await?

Having a problem in Wikipedia api while using async await?
0

#1

Basicaly Im Using Asyn and Await for Requesting and handling the request.
But it seems like my javascript is doing nothing. This is my pen on CodePen.

Any Help is openheartly welcome.

Thanks in advance


#2

You have many issues affecting you being able to see a result.

#1) Your code will not run at all, because you have a syntax error on the following line. To access a property named '*', you would need to use bracket notation like: error['*']

$("#results-board").text(error.*);

#2) You should not be calling bringWikipediaDatas directly inside the $(document).ready callback function. You want to call it once you have clicked the search button. You need to move your click event to be inside the $(document).ready callback function and then call bringWikipediaDatas. If not, how is it going to get a value from the input with id=“search-term”? If you just run the bringWikipediaDatas function when the page loads, there is no value in the input.

#3) Because you are using a form, you will need to prevent the form from submitting when the button is clicked. If you do not, the page will basically just reload without the other code executing. Read about the preventDefault function to accomplish that.


#3

@Abd.Qadir,
opening your project in code pen first reveals you have a syntax error in your javascript on line 19. What is error.*? You probably meant error
Second, you are immediately calling your async task and not waiting for any input by the user and thus you are getting an error.
I would suggest to either create a listener for a button click or attach an onclick attribute to the button to call your async function.

Hope that helps.


#4

@RandellDawson @TomerPacific

Thank you for your precious instructions but I am still not getting the needed object and clueless about what wrong is happening?

Sorry for disturbing again.

The Pen


#5

@Abd.Qadir,
I ran your code on my machine and it seems to work:

By the way, I would fix the typo you have in Viewer (you wrote Veiwer)


#6

@TomerPacific

Ya, many Thanks.

I got the results on my machine too.
Finally, heading to bring the data on my page.

But, the last question
Why are my page items aligned at left on your machine though I have centered them!


#7

@Abd.Qadir,
I must of forgotten to include Bootstrap when I ran your code. It’s not a problem with your code.


#8

@TomerPacific & @RandellDawson

Thanks for All your help.
Sorry for the late reply. It took me longer to complete the project.
Maybe because of my poor understanding of APIs.
However, I have completed the project.

Here is the pen

Any feedback/criticism/advice is welcome.

Thanks again


#9

@Abd.Qadir,
good job following through and finishing the project :+1:
The overlook is very clean and user friendly.
I would maybe add a border around each article, just to create a separation between each link or anything else you may find that fits.

Also, the animation of the search box, to my taste, is a bit much. There are very rare scenarios where it needs to be that wide.


#10

5 posts were merged into an existing topic: Looking fro Help to complete TWITCH TV project