Documentation

Components

Blocks by AJAX comprises a number of complementary components:

  • Blocks by AJAX Templates to AJAX load many core blocks and addon blocks.
  • A helper used by many thrid party addon blocks to support AJAX loading templates.
  • A Remote Control block to override the default settings of Blocks by AJAX templates.
  • A Trigger block to facilitate easy triggering of AJAX loading in response to a link or button click.
  • Symbols to integrate with Magic Data. IMPORTANT - Magic Data is not required to use Blocks by AJAX.

Remote control

First, use of the remote control block is entirely optional. By default, any Blocks by AJAX template will load a block when its DOM becomes visible. If that is the behaviour you require, you don't need to use a Remote Control block.

Before v2.0 of Blocks by AJAX, you could customise the AJAX loading behaviour by creating new templates with your own Blocks by AJAX settings. 

The Remote Control block now provides an easy alternative enabling AJAX settings to be edited directly in the page. Each Remote Control block provides settings for one or more subsequent Blocks By Ajax templates. 

Settings available through the Remote Control block.

Initial AJAX load 

  • When visible (default).
  • Immediately.
  • After a configurable delay.
  • On the 'blocks_by_ajax' event.
  • When a form is submitted.
  • When the block is about to scroll into the window.

Loading marker

  • Selection of standard animations.
  • Select a file from the concrete5 File Manager.
  • A snippet of HTML.
  • None.
  • Optional on repeat loads.

Repeat AJAX load

  • None (default).
  • Optional - load once or load repetitively.
  • After each delay interval.
  • On the 'blocks_by_ajax' event.
  • Whenever a form is submitted.
  • Optional loading marker, disable for 'silent' replacement of content.

Form Integration

  • Append form data to AJAX parameters
  • Select any form by jQuery/CSS selector
  • Trigger AJAX load when a form is submitted
  • Magic Data symbols to read POST data

Magic Data integration

AJAX load a block containing Magic Data in response to a form submission and you can provide ineraction where the AJAX loaded block responds to the form inputs, all without coding a single line of php or JavaScript! To facilitate this, Blocks by AJAX includes:

  • Symbols to read POST, GET, REQUEST and other server/environment data.
  • Symbols to insert buttons/links to trigger Blocks by AJAX through the 'blocks_by_ajax' event.
  • Symbols to build form elements and trigger Blocks by AJAX with the elements as parameters.
  • Symbols to insert buttons/links to trigger any DOM event.
  • Option to evaluate Magic Data within Blocks by AJAX; any Blocks by AJAX template can now process Magic Data!
  • Symbols to delay Magic Data evaluation into an AJAX request.

Magic Data integration is entirely optional and is not required for AJAX loading.

Trigger

Also introduced with v2.0 of Blocks by AJAX is a simple Trigger block to show a link or button that, when clicked, will trigger the 'blocks_by_ajax' DOM event. The AJAX setting should be 'on_event', set either through a custom block template or through a Remote Control block.

Before creating a custom template

Many blocks already have a Blocks by AJAX template. So check the Blocks by AJAX forum and/or ask the block develoepr see if a Blocks by AJAX  template is already available.

Next, try the block in a  Universal Content Puller block, Stack Randomizer block or Global Areas block with a with a Blocks by AJAX template. This will confirm that the block is actually loadable by AJAX and you are not wasting your time developing a custom template.

Creating AJAX block templates

Full details on creating a custom template for other block types are given in the support pages.

Stacks, areas and anything by AJAX

Available separately through the marketplace is the Universal Content Puller block which includes pulling content from stacks, other page areas and anywhere on the web using a Blocks by AJAX  template.

Universal Content Puller is also the best way of testing out a block for AJAX compatibility before creating a custom template.

Further reading