AJAX Forms - deprecated page

this page should be removed.

Ajax Dialog Boxes

Overview

Dialogs are often referred to as dialog boxes, modal windows, or pop-up windows. Whatever you call them, they are a quick and easy way to display additional information without having to reload the entire page. Dialog boxes can display just some static text, any node or form of your page, a views page, or any custom markup you'll feed to them.  

AJAX API

Using the AJAX API to dynamically update forms/displays.

The AJAX API allows information displayed on forms to be updated dynamically without reloading the entire page.  This API allows replacing DOM elements with new HTML or executing jQuery commands.  The following pages will show how to use the built in AJAX API to modify your own pages.

THIS IS A WORK IN PROGRESS, please feel free to add to this documentation.

Making Ajax menu links

Goal: create a menu link that, when clicked, runs a Drupal Ajax command, rather than jumping to a new page.

There are three steps:

  1. Create a menu item in your module's .menu.yml file.
  2. Create a route for the menu item in your module's .routing.yml file, pointing to a controller method.
  3. Create a controller method. The method runs on the server. It sends Ajax commands to Drupal's client-side Ajax library.

Step 1. Create a menu entry in your module's *.links.menu.yml file

Here is an example:

AJAX Forms

Overview

Adding AJAX callback events to form fields allows to dynamically update fields and other markup, while users interact with the forms.

More general information about Drupal and Ajax can be found at Drupal Ajax API Guide and Drupal's Ajax API documentation (at api.drupal.org).

Some working examples can be found in the Examples for Developers modules, specifically in the AJAX Example submodule, see its Form folder.

Subscribe with RSS Subscribe to RSS - Ajax