openCPQ Embedding Demo

Configurators are frequently invoked from business software such as web shops, CRM systems, and ERP systems. This page demonstrates the embedding of openCPQ-based configurators in a very simple parent application. To make it easy to understand the code and to re-use parts of it, this demo application does not depend on a particular business application. For implementation details have a look at the source of this HTML file and the heavily commented JavaScript code.

While we demonstrate the embedding functionality here as a part of the optical-transport demo for convenience, notice that the embedding is only loosely coupled to the particular embedded configurators. In production an embedding application is typically managed independently of the configurators.

Below you find a list of instances of configurable products. Each list item contains:

• Buttons for manipulating the item.
• The product type, i.e., the name of the configurable product.
• The internal representation of the configuration. (This is just for demonstration purposes. It would not be displayed in a real application.)
• The price returned by the configurator. (In a real application this would be properly formatted as a monetary amount.)
• The product configuration in human-readable form.

To extend the list, select a product type and create a new instance.