Workflow: Hide ticket forms based on a user's organization

Create a customized support experience by presenting only relevant tickets forms to your customers on your help center. In this tutorial you'll learn how to hide specific ticket forms based on a user's organization.

The workflow includes the steps below.

• Step 1: Find the ticket form ID
• Step 2: Find the organization name
• Step 3: Edit the JavaScript

This workflow doesn't work for unauthenticated users or users who don't have an organization. For these users, all the forms will display.

If your theme uses Guide Templating V2, you must import jQuery. For full details, see the article: Importing or upgrading jQuery.

Disclaimer: This article is provided for instructional purposes only. Zendesk does not support or guarantee the code. Zendesk also can't support third-party technologies such as JavaScript, jQuery, or CSS. Post any issues in the comments section or try searching for a solution online.

Step 1: Find the ticket form ID

1. In your ticket forms, open the appropriate ticket form
2. In the URL, find the ID number, after the last slash

Step 2: Find the organization name

1. In Support, open the Customers tab
2. Browse or search for organizations to find the right organization name

Step 3: Edit the JavaScript

If your theme uses Guide Templating V2, you must import jQuery. For full details, see the article: Importing or upgrading jQuery. The code relies on the DOMNodeInserted Mutation Event. Newer versions of Chrome and Chromium have ended support for this mutation event. To be compatible with browsers that do not support DOMNodeInserted, follow the Mutation Observer guidance and migrate to a newer function.

1. In Guide, click the Customize design icon () in the sidebar
2. Click the name of the theme you want to edit
3. Click the options menu and select Edit Code, and select Script.js
4. Copy the code block below:
   

   $(document).ready(function() {
     var formID = 6502769669773; // Change this to the form ID you wish to remove
       var userOrgs = window.HelpCenter.user.organizations;
       var userOrgNames = userOrgs.map(org => org.name);
   
   if (!(userOrgNames.includes("ZENDESK"))) { // Specify the organization name here
   
         // If the user does not belong to the organization specified, remove the form option from the dropdown
         $('#request_issue_type_select option[value="' + formID + '"]').remove();
         $('.nesty-panel').on('DOMNodeInserted', function(e) {
           $(this).children('ul').children().remove('#' + formID);
         });
       }
     });

5. Paste the code into the JavaScript template of your help center code
6. Replace the formID = 6502769669773 variable with the ticket form ID you wish to hide
7. Replace "ZENDESK" with the name of the organization that you want the ticket form visible to
8. If the user does not copy all characters such as ; and } from the template, the code may break the page
9. Save your template and publish changes

The provided code reserves space for other organizations. To add additional forms and organizations, copy the if statement above and place it under the existing if statement below, ensuring to replace the ticket form id with the correct one and the organization you want to check and see if the user is in. Repeat this for however many ticket forms and organizations you want.

To change the code behavior to display one ticket form to all organizations except the one specified, remove the NOT operator (!) from the if statement.

for (var c in HelpCenter.user.organizations) {
 if (HelpCenter.user.organizations[c].name !== "ZENDESK"){
 $("#TICKT_FORM_ID").remove();
 } 

if (HelpCenter.user.organizations[c].name !== "MYORG"){
 $("#TICKET_FORM_ID2").remove();
 }