Hello,
I have two problems that I am trying to solve for the tweet button and a general misunderstanding with the generator.
Tweet:
- I am trying to use the Bootstrap Awesome Icons, but it is not showing up on the screen
- I am trying to place the button slightly left of the (-) indicator by the author but still on the same row as it is on now (or it might be called the bottom-left corner of author) but I am having difficulty doing so. I am using the Bootstrap Column system trying to accomplish this
Random Quote Generator:
- I got an API from Kutipan for generating the quotes. I am having difficulty connecting the API to the website. I am probably doing something stupid in the basics (JavaScript hasn’t been my greatest subject so far). Any help in that area would be appreciated.
Link:
Thank you for your time,
Open the JS console in your browser and then load your application. You’ll see an error message in there that you need to fix.
lol I just made a JS quote object, filled it with quotes and used it
Hey , Im sorry but did you just copy all the code from some source ? Also, are you sure that your entire app is not missing something important ?
@bbsmooth:
I see the error code for the generator, I don’t see anything about the twitter symbol
@divyanshtiwari:
In the HTML portion:
- I got the links from the lessons that said that they had to be there for them to work
- The rest of the code I typed
The CSS portion:
- The imports were from codepen’s back editor
- I have been doing some trial and error with things like centering the box on the page by going to the example and see how they did it
- Everything else, I wrote
The JS portion:
- I got the code from the source I referenced in the notes
- I tried going by the example given for what I thought was relevant, but right now I am just trying to get the API figured out since that is covered in a later section
- Everything else I wrote
I am not quite sure what you mean by very important. I do know that the JS part is not even halfway done, but I can’t figure out how to reference this API. After I get that, then I can write the functions for the starting quote, the new quote button, and the tweet button.
The error I am seeing is:
Uncaught TypeError: Bootstrap's JavaScript requires jQuery. jQuery must be included before Bootstrap's JavaScript.
1 Like
I didn’t see that, but I imported jQuery as one of the inputs
Yes, you did, but not in the correct order. As the error message says, jQuery must be loaded first.
1 Like
I think I changed it around, both in the back editor and the import listing (since there was no change when I just changed the back end portion) but I still don’t see a change
No errors are showing up in my console anymore, but nothing changed
Hey,
I am trying to use the Bootstrap Awesome Icons, but it is not showing up on the screen
Use <i class="fab fa-twitter"></i>
or Font Awesome 4
1 Like
@divyanshtiwari:
Maybe I should just make an array full of quotes and authors and be done with this project, lol
(tomorrow though I am done with this for tonight )
1 Like
Okay, so I am almost done with my second attempt (I think), but I am getting stuck once again with my functions.
function getQuote(myArray){
get = Math.floor(Math.random(myArray)*myArray.length+1);
quote = get.quote;
author = get.author;
}
function displayQuote(getQuote){
return(
text = getQuote.quote;
anon = getQuote.author;
)
}
Where am I going wrong?
When i console.log(getQuote) it returns with my New Quote button.
I know that the second one doesn’t work because of the first, but I would like to fix it if it’s wrong if I can
Hmm how do you think it supposed to work?
you can use global variables( without const/let/var ) but it’s a bad practice
function getQuote(myArray){
get = Math.floor(Math.random(myArray)*myArray.length+1); //get random number say 6
quote = get.quote; // 6.quote? is that what you tried todo?
author = get.author;
}
function displayQuote(getQuote){
return(
text = getQuote.quote,
anon = getQuote.author;
)
}
Math random() is not expecting any arguments
try to console.log
parts of your array without functions
console.log(getQuote)
logs your button because getQuote
is global variable, getQuote=== window.getQuote===
//element with id getQuote
How To Access Elements in the DOM
After some time reading and debugging this is where I am at.
function getQuote() {
return Math.floor(Math.random() * Math.floor(myArray.length));}
function test(getQuote) {
random = getQuote();
quote = myArray[random].quote;
}
Results;
- I have been able to get the function getQuote() to produce a random number.
- When I console.log myArray with the number generated I get the Object that it should come up with.
- When I add .quote to that same console.log I get the quote that I am trying to get.
- I tried myArray[a number][1] and got a button
Problems:
- I have tried using global functions instead of the test function and the console told me that myArray was not defined.
- I tried quote = myArray[getQuote(with and without the “()”)] and got different results, but both were still wrong.
- I have tried multiple other variations but was still unsuccessful.
This is probably the closest I gotten it to work. What should I do next?