Skip to content

activateUTips() - Merciglobal Cloud ERP

The activateUTips() function is a custom JavaScript utility provided within the Merci U Library, specifically designed for use across the Merciglobal Cloud ERP ecosystem. It initializes and activates tooltip elements throughout the user interface, improving user experience and interface interactivity.

Purpose

The function is intended to:

  • Enable dynamic tooltips for UI elements.
  • Improve usability by providing contextual help and quick tips.
  • Enhance the visual interaction without overwhelming the user.

Usage

activateUTips();
Call activateUTips() after the DOM is fully loaded or after dynamic content insertion to ensure all tooltip elements are initialized correctly.

How It Works

  • The function scans the DOM for elements with a specific data attribute, such as data-utooltip.
  • Initializes Merci U Library tooltip instances for those elements.
  • Attaches necessary event listeners (hover, focus, etc.) to show/hide the tooltips dynamically.

When to Use

  • After rendering dynamic components or templates that include tooltip targets.
  • When resetting or reinitializing the UI (e.g., after AJAX calls).

When Not to Use

  • Avoid redundant calls unless new elements with tooltips are added to the DOM.
  • Do not call during DOM transitions to prevent tooltip rendering issues.

Example

<button data-utooltip="Click to submit the form">Submit</button>

// Activate tooltips on all eligible elements
activateUTips();

Security Considerations

Ensure that tooltip content does not include user-generated content without sanitization to prevent XSS vulnerabilities.

Developer Notes

  • Make sure Merci U Library is fully loaded before invoking activateUTips().
  • Use with SPA frameworks or templating systems by placing calls in lifecycle hooks.

Stay consistent in enhancing your Merciglobal Cloud ERP interface by leveraging utility functions like activateUTips() to bring intuitive guidance directly to your users' fingertips.

For internal usage, refer to the full documentation on the Merci Developer Portal.