---
schema_version: "1"
id: 02f40972101052ba6efde95b3fb709db30148955bebd6ca89c8b5b8dfec2bab9
title: Populate Pre-Chat Form Fields in Enhanced Web Chat
collection: developer
version: current
locale: en-us
portal_url: https://docs.salesforce.com/developer/current/en-us/service-cloud/messaging-web/guides/populate-prechat-fields.md
canonical_url: https://developer.salesforce.com/docs/service/messaging-web/guide/populate-prechat-fields.html
source_site: developer.salesforce.com
content_type: documentation
content_hash: bd00cfeb47300cc566f2495e1f6d8c2c3b6a3ae90013cc853fab326157ee7af3
products:
  - Enhanced Web Chat
  - Service Cloud Developer Content
---
# Populate Pre-Chat Form Fields in Enhanced Web Chat

When customers start a messaging conversation, you sometimes already know basic information such as their name, email address, and what product they're looking at. You set up a pre-chat form in the UI with visible fields such as name, email address, and product name. Then you use the [`prechatAPI`](/docs/service/messaging-web/references/m4w-reference/prechatAPI.html) object to populate the pre-chat fields with this information, so it appears when the user first opens the pre-chat form. With the API, you can also configure a field to be editable or not by the user and remove populated values again.

If you use your messaging conversation windows in Experience Cloud sites, you can enable contact fields to fill in automatically by editing the pre-chat fields in **Embedded Service Deployments** in Setup. See [Customize Pre-Chat for Enhanced Chat](https://help.salesforce.com/s/articleView?id=service.miaw_custom_prechat_2.htm) in _Salesforce Help_.

Before you use the API, add the visible fields to the pre-chat form. See [Customize Pre-Chat for Enhanced Chat](https://help.salesforce.com/s/articleView?id=service.miaw_custom_prechat_2.htm) in _Salesforce Help_. Here are the steps to configure your web client to populate pre-chat fields with data.

1. Download the Salesforce-provided code snippet from your Embedded Service Deployments in Setup as described in [Get Started with Enhanced Web Chat](/docs/service/messaging-web/guide/introduction.html). You need the snippet, because you modify its code in later steps.
2. Add an event listener for [`onEmbeddedMessagingReady`](/docs/service/messaging-web/guide/event-listeners.html). This method notifies you when the API is ready for requests.
3. After the `onEmbeddedMessagingReady` event dispatches, populate the pre-chat fields by using [`setVisiblePrechatFields`](https://developer.salesforce.com/docs/service/messaging-web/guide/docs/service/messaging-web/references/m4w-reference/prechatAPI.html#setvisibleprechatfieldsfields) and remove the values by using [`unsetVisiblePrechatFields`](/docs/service/messaging-web/references/m4w-reference/prechatAPI.html#unsetvisibleprechatfieldsfields).
   - Use the channel variable name of your custom or standard pre-chat fields for the pre-chat field names. From Setup, in the Quick Find box, enter `Messaging Settings`, and then select **Messaging Settings**. Click the name of your messaging channel. The channel variable names are listed in the Parameter Mappings section.
   - Standard pre-chat fields start with an underscore. They are `_firstName`, `_lastName`, `_email`, and `_subject`.
   - For more information on editing pre-chat fields, see [Customize Pre-Chat for Enhanced Chat](https://help.salesforce.com/s/articleView?id=service.miaw_custom_prechat_2.htm) in _Salesforce Help_.

This sample code shows you how to add values to pre-chat fields by using `setVisiblePrechatFields`.

```javascript
window.addEventListener("onEmbeddedMessagingReady", e => {
  embeddedservice_bootstrap.prechatAPI.setVisiblePrechatFields({
    // List the pre-chat field names with the value and whether
    // it's editable in the pre-chat form.
    "_firstName": {
      "value": "Jane",
      "isEditableByEndUser": false
    },
    "dropdown_prechat": {
      "value": "A2",
      "isEditableByEndUser": false
    },
    "checkbox_prechat": {
      "value": false,
      "isEditableByEndUser": false
    }
  });
});
```

This sample code shows you how to remove values from pre-chat fields by using `unsetVisiblePrechatFields`. Use the channel variable name as the pre-chat field name here as well.

```javascript
embeddedservice_bootstrap.prechatAPI.unsetVisiblePrechatFields(
// List one or more field names.
    ['_firstName','dropdown_prechat']);
```

The Enhanced Web Chat [reference documentation](/docs/service/messaging-web/references/m4w-reference/prechatAPI.html) describes these methods in detail.

**note:** If your Enhanced Web Chat deployment is on an Experience Cloud site, follow the instructions in _Salesforce Help_ to add JavaScript code to the head markup section of your site. See [Configure an Enhanced Web Chat Deployment in an Experience Builder Site](https://help.salesforce.com/s/articleView?id=service.miaw_deployment_experience_builder.htm) in _Salesforce Help_.

