Adding AJAX to a Rails CRUD UI With Intercooler

This tutorial will show you how to add AJAX to a Rails CRUD UI using Intercooler.

Video

Outline

Here are the steps for converting a Rails CRUD UI into an AJAX UI

  • Add a reference to the the IntercoolerJS library from the download page.
  • Update the edit button to use the ic-get-from and ic-target attributes.
  • Update the controller to not render layouts for intercooler requests by using the ic-request parameter.
  • Update the save button to use the ic-put-to and ic-target attributes.
  • Update the controller's update method to render partials correct.y
  • Set the location of the browser using the X-IC-SetLocation header.
  • Update the new and create UI and controller code in a similar manner.

Git Diff

Here is a diff between the standard Rails code and Intercooler-powered code:

https://github.com/LeadDyno/intercooler-tutorial-app/commit/b425ad671746c34039bd84fc76bb7c11d6537b24