General Component Methods

Components are what make an experience. The methods in this section can be used to interact with any component in your experience. For methods specific to individual component types, refer to the respective component sections.

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.

note

This method removes the components from the markup entirely.

This example will hide the form sign_up_436366175206, all Direct Upload components (Photo Upload and Video 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.

note

This method removes the component from the markup entirely.

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 (Photo Upload and Video 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');