Back to Bootstrap class

Method popover

public static void
popover
(mixed $selector = '', mixed $options = [])
Add javascript support for Bootstrap popovers
Parameters
  • string $selector Selector for the popover
  • array $options The options for the popover
Returns
  • void
Since
  • 3.0
Class: Bootstrap
Project: Joomla

Method popover - Source code

/**
 * Add javascript support for Bootstrap popovers
 *
 * Use element's Title as popover content
 *
 * @param   string  $selector  Selector for the popover
 * @param   array   $options   The options for the popover
 *
 * @return  void
 *
 * @since   3.0
 *
 * - Options for the popover can be:
 * - animation    boolean  true   Apply a CSS fade transition to the popover
 * - container    string|  false  Appends the popover to a specific element. Eg.: 'body'
 *                boolean
 * - content      string   null   Default content value if data-bs-content attribute isn't present
 * - delay        number   0      Delay showing and hiding the popover (ms)
 *                                 does not apply to manual trigger type
 * - html         boolean  true   Insert HTML into the popover. If false, innerText property will be used
 *                                 to insert content into the DOM.
 * - placement    string   right  How to position the popover - auto | top | bottom | left | right.
 *                                 When auto is specified, it will dynamically reorient the popover
 * - selector     string   false  If a selector is provided, popover objects will be delegated to the
 *                                 specified targets.
 * - template     string   null   Base HTML to use when creating the popover.
 * - title        string   null   Default title value if `title` tag isn't present
 * - trigger      string   click  How popover is triggered - click | hover | focus | manual
 * - offset       integer  0      Offset of the popover relative to its target.
 */
public static function popover($selector = '', $options = []) : void
{
    // Only load once
    if (isset(static::$loaded[__METHOD__][$selector])) {
        return;
    }
    if ($selector !== '') {
        // Setup options object
        $opt['animation'] = isset($options['animation']) ? (bool) $options['animation'] : true;
        $opt['container'] = isset($options['container']) ? $options['container'] : 'body';
        $opt['content'] = isset($options['content']) ? $options['content'] : null;
        $opt['delay'] = isset($options['delay']) ? (int) $options['delay'] : ['show' => 50, 'hide' => 200];
        $opt['html'] = isset($options['html']) ? (bool) $options['html'] : true;
        $opt['placement'] = isset($options['placement']) ? $options['placement'] : null;
        $opt['selector'] = isset($options['selector']) ? $options['selector'] : false;
        $opt['template'] = isset($options['template']) ? $options['template'] : null;
        $opt['title'] = isset($options['title']) ? $options['title'] : null;
        $opt['trigger'] = isset($options['trigger']) ? $options['trigger'] : 'click';
        $opt['offset'] = isset($options['offset']) ? $options['offset'] : [0, 10];
        $opt['fallbackPlacement'] = isset($options['fallbackPlacement']) ? $options['fallbackPlacement'] : null;
        $opt['boundary'] = isset($options['boundary']) ? $options['boundary'] : 'scrollParent';
        $opt['customClass'] = isset($options['customClass']) ? $options['customClass'] : null;
        $opt['sanitize'] = isset($options['sanitize']) ? (bool) $options['sanitize'] : null;
        $opt['allowList'] = isset($options['allowList']) ? $options['allowList'] : null;
        Factory::getDocument()->addScriptOptions('bootstrap.popover', [$selector => (object) array_filter((array) $opt)]);
    }
    // Include the Bootstrap component
    Factory::getApplication()->getDocument()->getWebAssetManager()->useScript('bootstrap.popover');
    static::$loaded[__METHOD__][$selector] = true;
}