Snippets-components relationship

Template snippets are markup, whereas components are code.

There is not a one-to-one relation between snippets and components. Any part of the markup may be linked to a component by defining a data-g-id attribute. The data-g-id attribute is the only link between the markup and the components.

In the Client-Side Framework (CSF) initialization, when the page DOM has been loaded from the server, the CSF looks for all data-g-id attributes and creates a new component according to the content of the attribute.

The content is a comma-separated list of arguments, where only the first one is significant for the CSF. The first argument is used to match to a component is the gwc.componentSet namespace object. Any other arguments are free for you to use as needed.

Any change in the value of the data-g-id component leads to a component destruction and construction.

Example

The Edit snippet markup includes:

<input
  ...
  data-g-id='{type},{xdid}'
  ...

The Edit component:

gwc.componentSet.Edit = function(type, xdid) { …