--- layout: default nav: tutorial ---

## Intercooler Examples

Below are a series of examples demonstrating common UI/UX problems being solved with intercooler. All examples use mockjax to provide server side responses. I've tried to make it fairly obvious what your server-side environment would need to do to implement them.

### Examples

Title | Description
--- | ---
Click To Edit | A simple demo of inline editing of data within a page
Infinite Scroll | Loading more elements when the bottom of a page is scrolled into view.
Click To Load | Similar to the infinite scroll demo, but requires that a user explicitly click on a button to load more items.
Bulk Update UI | A demo of a table-driven UI, where multiple rows are updated at once via checkbox selection.
Lazily Loading An Element | Lazily loading an element can be used to make perceived performance faster: the enclosing page loads quickly, the computationally intensive section loads when it is ready, and a spinner is shown to indicate things are happening.
Inline Form Validation | Shows how inputs can be validated on the server side on change, allowing you to keep all validation logic secure and centralized.
Inline Row Removal | Similar to the Bulk Update Demo, this shows how to remove items from a table UI
Active Search | Demonstrates how to implement a Google-like active search, where results are show as the user types
Dependent Select | Shows how to implement selects that depend on one another: by changing one, the values available in the other select are retrieved from the server side.
History Support | Demonstrates how to integrate History into your Intercooler app with a simple tabbed example.
Pause/Play Live View | Shows how to implement a Pause/Play UI for a polling-based live view.
Job Runner | Shows how to implement a fairly complicated Job-Runner UI, with smoothly animated progress bars.
Integrating With Typeahead | Shows how to integrate intercooler functionality into bootstraps typeahead functionality.
Bootstrap Confirm | Shows how to use a Bootstrap confirm dialog with an intercooler button.
Sortable List | Shows how to use SortableJS and intercooler.js to save a drag-and-drop ordered list after updates.
Prototyping | Shows how to do client-side only intercooler development using the `ic-ignore` attribute and local sections
Integrated Debugger | Shows how to work with the integrated debugging environment in Intercooler.
Modifying Requests | Shows how to modify an intercooler request via client side javascript: adding custom headers, variables or canceling a request.

### Examples

### Videos

Some Older Videos - Rails oriented & dated, but still potentially useful.