Skip to content

Conversation

@tannerwelsh
Copy link
Contributor

This branch add supports for the following features:

  • A user may add skills directly on their résumé show page
  • Adding skills does not require a page refresh (i.e. must be AJAX)
  • Added skills immediately show on the page in the appropriate spot
  • A user may add jobs directly to their résumé show page, including the job title, description, and company name
  • Adding jobs does not require a page refresh (i.e. must be AJAX)
  • Added jobs immediately show on the page in the appropriate spot

Note that the JavaScript introduced degrades gracefully, meaning that if a user has disabled JavaScript in their browser, the site will still function as expected. New skill and job forms will be sent via HTTP, and the page will refresh showing the updated information.

This branch introduces a dependency on jQuery, a popular and powerful JavaScript library.

Organization! Ohhhhh yeah.
Adds dependency on the jQuery library (loaded via the CDN).

Adding a skill using the form on the résumé show page now uses AJAX
to allow users to add skills without requiring a full page refresh.

Sending an AJAX request to create a new resource generally involves
writing JavaScript code that implements the following steps:

- Bind to the "submit" event of a form
- Prevent the form from doing what it would normally do (usually: send
  an HTTP POST request)
- Send an XMLHTTPRequest with the "POST" method, passing along the form
  data in the request body (in this case, we're using jQuery's `$.post`
  method to abstract over the logic of sending a request)
- Add an event listener to handle the response when it comes back (this
  is the asynchronous part: we give the browser a function and say "hey,
  whenever you hear back from the server, run this code.")
By sending the all of the form data (using jQuery's .serialize()
function), the server can create a new skill from the form data whether
it is sent via AJAX or a regular HTTP POST request. This is useful in
case the user has disabled JavaScript.

To determine what kind of response to send back, we call `.xhr?` on the
`request` object, which returns true if the server is responding to an
AJAX request. That way, we can send back whatever the JavaScript wants
(in this case it is a snippet of HTML).
Better to break up the work into separate functions with explicit
purposes. +1 code style points.
Same deal as with skills, now jobs can be added asynchronously too.
tannerwelsh added a commit that referenced this pull request Oct 30, 2014
Skills and jobs created asynchronously
@tannerwelsh tannerwelsh merged commit fe85882 into master Oct 30, 2014
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants