Add hidden fields in a Case Deflection component

This is for:

Developer System Administrator

Pro and Enterprise editions

Note

The Coveo Case Deflection Component is the Locker compliant version of the Coveo Case Creation component.

When creating a Case Deflection component, you might want to add fields with default values that can’t be seen by the user. This way, every case created through the interface has a specific field that’s automatically filled in without the user noticing.

This can be achieved by adding a hidden="hidden" option in the code of your component, which makes it so that it doesn’t appear to the user, but is still taken into account when creating a case.

In this tutorial, you’ll learn how to add a hidden picklist component that automatically sets the Origin field to Web without the user needing to see it.

  1. Ensure that you’ve inserted the Case Deflection component in your Salesforce Experience Cloud site (see Integrating a Case Deflection Component).

  2. In your Experience Builder, in the Preview mode of the page where your Case Deflection component is, open the Interface Editor.

    With Coveo for Salesforce V3 With Coveo for Salesforce V2

    In the upper-left corner of the component, click Edit Search Page.
    image:https://docs.coveo.com/en/assets/images/coveo-for-salesforce/attachments/36637021/40632921.png[Edit Search Page button

    Coveo for Salesforce]

    In the lower-right corner of the component, click the arrow button to expand the box; then, click Edit.
    image:https://docs.coveo.com/en/assets/images/coveo-for-salesforce/attachments/36637021/37095746.gif[Edit button

    Coveo for Salesforce]

  3. In the Interface Editor, drag the picklist component onto your page.

    Drag picklist onto page | Coveo for Salesforce

  4. In the Picklist Options window, enter the following information:

    1. Title: Origin

    2. Case field: Origin

    3. Default value: Web

    4. Select Save to save your picklist component.

  5. At the upper right of the page, select Code View to access the code of your component.

  6. Locate the picklist component you just added. It should look like this:

    <div class="CoveoPicklist" data-title="Picklist" data-case-field="Origin" data-default-value="Web"></div>

  7. In the component code, add a hidden="hidden" option. Your component should now look like this:

    <div class="CoveoPicklist" data-title="Picklist" data-case-field="Origin" data-default-value="Web" hidden="hidden"></div>

  8. Save your page. Your component is now hidden, but is still added when creating a case.

Important

This method can’t and shouldn’t be used to enter confidential or secure content, as any user can reveal the component in their browser’s console.