Custom Pre-Chat Component Sample Using JavaScript

The following code sample contains examples of the component, controller, and helper code for a custom pre-chat component using plain JavaScript.

This component:

Uses Javascript to create an email input field
Uses minimal Aura to get pre-chat fields from Embedded Service setup in a render handler
Provides an example of getting pre-chat field values to pass to the startChat Aura method on lightningsnapin:prechatAPI

This code sample is an example and doesn’t create a functioning pre-chat form on its own. You can use this sample as a starting point, but you must add more pre-chat fields and include your own styling.

Important

Component Code

Controller Code

Helper Code

The sample creates the following unstyled pre-chat form. Preview of the unstyled pre-chat form using this code sample.

Embedded Service for Web Developer Guide

Custom Pre-Chat Component Sample Using JavaScript

Component Code

Controller Code

Helper Code