postMessage

iConfigure uses postMessage in two separate protocols. Do not mix them when handling events on your page.

A. Submission responses (integrators)

When PostMessage is enabled on a submit button, the configurator/form app sends a message to window.parent after a successful API submit.

Enable in Manager → Data → Submissions → Action buttons → Triggers → PostMessage (“For iframe / embed integrations”).

Messages are only sent when the app runs inside an iframe. The app determines your page's origin from the browser (ancestor origin or referrer) and posts only to that origin, so do not set referrerpolicy="no-referrer" on the iframe.

Without PostMessage enabled, an embedded app still sends a minimal message after a successful submit: { name: 'quotation', state: 'finished', productId, total }.

Quotation finished

Sent when the button creates a quotation (at least one of Generate quotation PDF, Send confirmation email or POST to a URL is enabled). pdf_url is null when no PDF is generated:

{
  name: 'quotation',
  state: 'finished',
  productId: 'product-uuid',
  total: 1250.5,
  quotation_id: 'quotation-uuid',
  pdf_url: 'https://...'
}

Cart action finished

Sent when the button has PostMessage enabled but none of Generate quotation PDF, Send confirmation email or POST to a URL. No quotation is created and no contact details are required:

{
  name: 'cart.action',
  state: 'finished',
  button_id: 'button-id',
  productId: 'product-uuid',
  product_id: 'product-uuid',
  dealer_id: null,
  dealer_product_id: null,
  language: 'NL',
  extra_fields: {},
  items: [ /* enriched configuration items */ ]
}

Host page listener

For iFrame embeds. With Script inject the configurator runs directly in your page (no iframe), so no submission message is posted to it.

<script>
  const TRUSTED_ORIGIN = 'https://configurator.iconfigure.io'

  window.addEventListener('message', (event) => {
    if (event.origin !== TRUSTED_ORIGIN) return

    let data = event.data
    if (typeof data === 'string') {
      try { data = JSON.parse(data) } catch { return }
    }
    if (!data || data.state !== 'finished') return

    switch (data.name) {
      case 'quotation':
        console.log('Quotation ID:', data.quotation_id, 'PDF:', data.pdf_url)
        break
      case 'cart.action':
        console.log('Cart items:', data.items)
        break
    }
  })
</script>

String vs object

Submission messages are sent as plain objects. Parsing strings, as in the example above, is only a defensive check.

B. Manager embed protocol (iconfigure:*)

Used when the configurator runs inside Manager (preconfiguration editor, quotation line editor). Messages use type starting with iconfigure:. The configurator only exchanges these messages with iConfigure Manager origins, so they cannot be used from your own website.

Configurator → parent

type	Payload	When
iconfigure:ready	{ productId }	Configuration loaded
iconfigure:state-update	{ items, totalPrice, productId, dealerProductId }	User changes options (debounced), after the parent acknowledged iconfigure:ready
iconfigure:submit	{ items, totalPrice, productId, dealerProductId }	Save preconfiguration in Manager

Parent → configurator

type	Payload	When
iconfigure:ack	{ ackedType: 'iconfigure:ready' }	Acknowledge iconfigure:ready (the configurator repeats ready until acknowledged)
iconfigure:request-state	{}	Ask for an immediate iconfigure:state-update
iconfigure:load-preconfig	{ preConfiguration }	Load saved preconfiguration

This protocol is primarily for Manager tooling, not typical customer website embeds.

Submit payload fields (API)

The client sends this to the add-quote API (relevant for custom integrations):

Field	Description
buttonId	Submit button internal ID

The submission configuration (and its PDF template) is resolved server-side from the product or showroom; output_id and templateId sent by the client are ignored.

See Submissions & outputs.

Related

• Webhooks — Server-side equivalent of submit notifications
• Script inject
• iFrame embed