Ad

Sunday, March 10, 2013

Tutorial - Stuck on Code School jQuery 3.8 Click Interaction

The instruction really was not clear on this section, I got stuck multiple times and decide to publish some hints and results to help people out.

This design of the entire course is beautiful and interactive, but it was definitely the most painful experience that I have had, even though I know a bit of jQuery already. I can see beginners being deterred forever if this is their first introduction to jQuery.

If you want hints, read this section. If you want answers, skip to the next section. Caution, either way, there're spoilers.

I'd like to do more of these troubleshooting blog posts and tutorial videos (check out some existing ones), especially for Codecademy, feel free to request!

Part 1. Clarification on the prompt
"We're making progress on our page, and it's close to being useful. The next step will be moving the code we have been working on into a click handler. Let's start by wrapping our previous code in a click handler for theBook Now buttons using the on() method."
Is rather unclear. What it means to say is that modify your codes so that they only are run, when the button is clicked, i.e. you will need a On function with an event handler 'click'. You will have to wrap all your previous codes in it.

The final result is that when the button is clicked, the message is appended and the button will disappear. So you will have to do something about the commented out line of button.remove too.

Part 2. Answers
See screenshot

2 comments:

  1. Where is the info? You start out stating how unclear code school is and how you will give some hints and answers, and then you just stop. Is there some secret code to take me to that page? Where are the hints and answers?

    ReplyDelete
  2. Where is the info? You start out stating how unclear code school is and how you will give some hints and answers, and then you just stop. Is there some secret code to take me to that page? Where are the hints and answers?

    ReplyDelete

React UI, UI UX, Reactstrap React Bootstrap

React UI MATERIAL  Install yarn add @material-ui/icons Reactstrap FORMS. Controlled Forms. Uncontrolled Forms.  Columns, grid