Custom Fields in Zendesk Web Widget Not Transferred to Tickets | Community
Skip to main content

Custom Fields in Zendesk Web Widget Not Transferred to Tickets

  • December 19, 2024
  • 3 replies
  • 0 views
G

Hi Community,

I’m having trouble with dynamically prefilled custom fields in the Zendesk web widget. Despite following the documentation, the fields remain empty in the API request and do not appear in the created ticket.

Steps I’ve taken:

  1. Created custom fields in the Zendesk Admin settings. The fields are configured as "Customer can edit."

  2. Used the following script to prefill fields dynamically using PHP variables:

    html

    Code kopieren

    <script type="text/javascript">    window.zESettings = {        webWidget: {            color: {                theme: '#9D7BFF',                launcherText: '#FFF'            },            contactForm: {                fields: [                    {                        id: 'name',                        prefill: { '*': '<?php echo $name; ?>' }                    },                    {                        id: 'email',                        prefill: { '*': '<?php echo $email; ?>' }                    },                    {                        id: 15119319576476,                        prefill: { '*': '<?php echo $goal; ?>' }                    }                ]            }        }    }; </script> <script id="ze-snippet" src="https://static.zdassets.com/ekr/snippet.js?key=<?php echo $_ENV["ZENDESC_KEY"]?>"> </script>

  3. Tested the setup. The widget appears correctly, but the dynamically prefilled values are not transmitted. For example:
    • name and email do not appear anywhere in the ticket.
    • The custom field with ID 15119319576476 is shown in the API request but has a null value.

The issue:

The generated API request looks like this:

json

Code kopieren

{  "request": {    "url": "https://MY_DOMAIN_BY_ZENDESK/api/v2/requests/104336.json",    "id": 104336,    "status": "new",    "priority": null,    "type": null,    "subject": "test",    "description": "test\n\n------------------\n",    "organization_id": null,    "via": {      "channel": "web",      "source": {        "from": {},        "to": {},        "rel": "web_widget"      }    },    "custom_fields": [      { "id": 15119319576476, "value": null }    ],    "fields": [      { "id": 15119319576476, "value": null }    ]  } }

My question:

  • Are there known limitations with dynamically prefilling fields in the web widget?
  • Do we need to handle dynamic variables differently to ensure they are transmitted properly to Zendesk tickets?
  • Has anyone successfully implemented dynamic prefill for custom fields in the web widget?

Any help or insight would be greatly appreciated. Thank you in advance!

    3 replies

    James57
    • James57
    • December 20, 2024

    Hi @gosia11,

    May I ask if you have tried this with static values and does it work correctly?  May I also ask if you have logged the dynamic PHP values separately in the page and make sure they are returning the value correctly?

    J
    • Jennifer51
    • December 20, 2024

    Hello,

     

    Based on what you've described, here are a few things to consider:

    Ensure Proper Field IDs: Double-check that the custom field IDs in your script match exactly with those in your Zendesk Admin settings. Even a small typo can cause issues.

    Data Types: Make sure the data types of your PHP variables ($name, $email, $goal) are correctly formatted and contain valid values before they are passed to the widget.

    JavaScript Execution: Verify that your JavaScript code is being executed correctly and that the PHP variables are being properly interpolated. See here: https://developer.zendesk.com/documentation/classic-web-widget-sdks/web-widget/quickstart-tutorials/Skydiving in Bir Billing, Himachal Pradesh/dynamically-change-web-widget-settings/?form=MG0AV3 You might want to use console.log() to debug and ensure the variables contain the expected values.

    API Permissions: Ensure that your API key has the necessary permissions to create tickets and prefill fields.

    Field Configuration: Confirm that the custom fields are configured to be editable by customers in the Zendesk Admin settings.

    Documentation and Examples: Refer to the Zendesk documentation for advanced customization and examples of prefilling fields.

     

    I hope this info is helpful to you.

     

    Best Regard,
    Jennifer Anderson

    G
    • Gosia11
    • Author
    • January 7, 2025

    Hi James and Jennifer,

    Thank you both for your suggestions! Let me clarify a few points and share what I’ve tried so far.

    1. Static Values Testing:
      Yes, I’ve tested with static values directly in the script. For example:

      javascript

      Code kopieren

      {  "fields": [    { "id": "name", "prefill": { "*": "John Doe" } },    { "id": "email", "prefill": { "*": "john.doe@example.com" } }  ] }

      Despite this, only the first name ("John") appears in the ticket, and custom fields are not populated.

    2. Dynamic PHP Values:
      • I’ve confirmed that the PHP variables (e.g., $name, $email, $goal) are correctly set and return valid values.

      • Using console.log() in the browser, I verified that the ZendeskSettings object includes all the expected values:

        json

        Code kopieren

        {  "name": "John Doe",  "email": "john.doe@example.com",  "custom_field_1": "Sample Value",  "custom_field_2": "Another Value" }

        The values are being passed correctly to the widget.

    3. Field IDs and Configuration:
      • I’ve double-checked that the custom field IDs in the script match exactly with those in Zendesk Admin.
      • The custom fields are configured as editable for customers in the Admin settings.
    4. JavaScript Execution:
      • The JavaScript code runs without errors. The widget initializes correctly, and the prefill values appear in the ZendeskSettings object as expected.
      • I’ve also tested different placement of the widget initialization script to ensure timing isn’t an issue.
    5. API and Permissions:
      • The API key has the necessary permissions to create tickets and manage prefill data. At least I can add prefill fields in the admin panel
    6. Behavior in Tickets:
      • When I view the submitted tickets in Zendesk Admin, the following is observed:
        • Only the first name appears (e.g., "John"), and no custom field data is included.

    Next Steps:
    I’m wondering if there’s a specific limitation with the Web Widget that might explain this behavior or if I’m missing something subtle in the setup.

    Thank you for your help, and I appreciate any additional insights!

    Terms & ConditionsCookie settingsAccessibility statement