Component Methods

Components are what make an experience. Using the following methods you can interact with components directly

hideComponents

Arguments:

Argument	Type	Description
componentList	array of strings - required	Components that should be hidden

Hide components in the experience dynamically. The method accepts an array of strings. The strings can be either componentId, normalized componentId or component Names

This example will hide the form sign_up_436366175206, all Direct Upload components, and the component with the name Component Name Given

window.wyng['_WYNG_ID_'].hideComponents([ 'sign_up_436366175206', 'direct_upload', 'Component Name Given' ]);

hideComponent

Arguments:

Argument	Type	Description
component	string - required	ComponentId or Component Name of Component to be hidden

Hide a component in the experience dynamically. The method accepts a string. The string can be either componentId, normalized componentId or a component name

This example will hide the form sign_up_436366175206

window.wyng['_WYNG_ID_'].hideComponent('sign_up_436366175206');

revealComponents

Arguments:

Argument	Type	Description
componentList	array of strings - required	Components that should be hidden

Reveal components in the experience dynamically. The method accepts an array of strings. The strings can be either componentId, normalized componentId or component Names

This example will reveal the form sign_up_436366175206, all Direct Upload components, and the component with the name Component Name Given

window.wyng['_WYNG_ID_'].revealComponents([ 'sign_up_436366175206', 'direct_upload', 'Component Name Given' ]);

revealComponent

Arguments:

Argument	Type	Description
component	string - required	ComponentId or Component Name of Component to be hidden

Reveal a component in the experience dynamically. The method accepts a string. The string can be either componentId, normalized componentId or a component name

This example will reveal the form sign_up_436366175206

window.wyng['_WYNG_ID_'].revealComponent('sign_up_436366175206');

setContent

Arguments:

Argument	Type	Description
component	string - required	ComponentId or Component Name of Component to be hidden
content	string - required	Content to be set

Set the content for a component dynamically. Depending on the type of component, there can be content set in the component. Use this method to dynamically change that content. This method will work on the Text Component, the HTML component, the Image component and the Button Component. If called for another component, nothing will change, and the new content will not get set.

Example

Text Component

The new content should be text, and will replace the text that is currently set. This example will set the string New text for the component as the new text that is displayed for the text component text_123456789

window.wyng['_WYNG_ID_'].setContent('text_123456789', 'New text for the component');

HTML Component

The new content can be HTML, and will replace the HTML content of the component that is currently set. This example will set the HTML for the HTML component html_123456789 to <div>Hello World!</div>

window.wyng['_WYNG_ID_'].setContent('html_123456789', '<div>Hello World!</div>');

Important

<script> tags that are dynamically set in the HTML Component using setContent() will be ignored.

Image Component

The content should be a valid URL for an image to display to replace the image that is currently being displayed. In this example the main image in the Image component image_123456789 will be replaced with the image: https://picsum.photos/100/50

window.wyng['_WYNG_ID_'].setContent('image_123456789', 'https://picsum.photos/100/50');

Button Component

The content should be text and will replace the current label text of the button.

window.wyng['_WYNG_ID_'].setContent('button_123456789', 'New Label');