foundation.link

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

When the action is triggered, it will cause the user agent to navigate to a URI, using window.open. It supports the following parameters:

config.data.href

The URI Template that will be expanded into a URI that the user agent navigates to. The URI Template is expanded using variables satisfying the following interface:

interface FoundationCollectionActionFoundationLinkVariables {
  /**
   * 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 target of the navigation. This is the strWindowName parameter of the window.open().

Example

Given a simple button:

<button>Navigate</button>

You can annotate it with foundation-collection-action to navigate to a URL based on collection selections when the user click it:

<button class="foundation-collection-action" data-foundation-collection-action='{"target": ".myapp-mycollection", "activeSelectionCount": "multiple", "action": "foundation.link", "data": {"href": "/my/link.html{?item*}", "target": "_blank"}}'>Navigate</button>

Relationship Graph