foundation.collection.action.action: foundation.dialog

foundation.dialog is an action of foundation-collection-action.

When the action is triggered, it will load and show the dialog. It supports the following parameters:

config.data.src

The URI Template to load the dialog.

It is expanded using variables satisfying the following interface:

interface FoundationCollectionActionFoundationDialogVariables {
  /**
   * The value of <code>data-foundation-collection-id</code> attribute of the given <code>collection</code> parameter.
   */
  id: string;

  /**
   * The array of values of <code>data-foundation-collection-item-id</code> attribute of the given <code>selections</code> parameter.
   */
  item: string[];
}

config.data.target

The selector to the .foundation-toggleable that will be shown upon activate.

config.data.nesting

Indicates the behavior when the action is also under another toggleable element.

It has the following value:

hide

Hide the parent toggleable element.

For example if the action is under Popover A. When the value is hide, upon activating the action, Popover A will also be closed.

Dialog Requirement

A dialog can be any element as long as it is implementing foundation-toggleable.

The target dialog is loaded based on the following priority:

1. The dialog loaded by src parameter, if the parameter is specified.
2. The dialog located at target parameter, if the parameter is specified.
3. The containing .foundation-toggleable. (i.e. equivalent to jQuery: action.closest(".foundation-toggleable"))

Relationship Graph