How can I hide ticket forms based on a user's organization?

Return to top
Have more questions? Submit a request

99 Comments

  • Jordan Dayton

    We would like to make the "Submit a request" link/button in the top navigation only be visible to users of several segments that we can easily define and update with new segments, over time.

    Any suggestions or snippets that y'all could share with us?

    0
  • Justin

    Has anyone been able to get this to work? I have tried a few solutions from the comments but not having any luck. 

    Our goal is to HIDE a single form from ALL users, except those with a specific tag. Speaking of tags, is the tag based on user tag? Org tag? User segment name?

    What's the best way to accomplish this?

    2
  • Julien Maneyrol

    I know of an easy way to hide specific ticket forms from anyone. I use this method because I want some forms to be only available from specific web widgets, while not using brands:

    $(document).ready(function() {
    $('#request_issue_type_selectoption[value="TICKET_FORM_ID1"]').remove();
    $('#request_issue_type_selectoption[value="TICKET_FORM_ID2"]').remove();
    $('.nesty-panel').on('DOMNodeInserted', function(e) {
    $('#TICKET_FORM_ID1').remove();
    $('#TICKET_FORM_ID2').remove();
    });
    });

    However, this uses JQuery. I would like to convert to VanillaJS but I have failed so far. Does anyone know how to translate this into VanillaJS?

    1
  • Julien Maneyrol

    I have managed to "translate" the first part, but I'm still stuck with the $(this).children('ul').children().remove('#TICKET_FORM_ID') JQuery which looks too "complex" to be easily translated. So the code looks like this now:

    // Hide PaaS and SaaS ticket forms. Written in JQuery, should be converted to VanillaJS later. Adapted from https://support.zendesk.com/hc/en-us/articles/206977397#Option_1
    document.addEventListener("DOMContentLoaded", function() {
    // Remove the forms from the dropdown selector
    document.querySelector('#request_issue_type_select option[value="360000198537"]').remove();
    document.querySelector('#request_issue_type_select option[value="360000208678"]').remove();
    document.querySelector('#request_issue_type_select option[value="360000295658"]').remove();
    // Remove the options from the nesty-input after it's been created.
    document.querySelector('.nesty-panel').addEventListener('DOMNodeInserted', function(event) {
    $(this).children('ul').children().remove('#360000198537');
    $(this).children('ul').children().remove('#360000208678');
    $(this).children('ul').children().remove('#360000295658');
    });
    });

    It works, but it is very ugly since it mixes Vanilla JS and JQuery.
    Help on making it 100% Vanilla JS would be very appreciated.

    1
  • Kay
    Community Moderator

    Hi Julien 👋

    Almost there.. this should be the final part to remove jQuery completely

    document.querySelector('.nesty-panel').addEventListener('DOMNodeInserted', function(event) {
    event.target.querySelector('li[id="360000198537"]').remove();
    event.target.querySelector('li[id="360000208678"]').remove();
    event.target.querySelector('li[id="360000295658"]').remove();
    });
    1
  • Julien Maneyrol

    Hi Kay,

    Wow, you just saved my day (and nights)! This works exactly the way I intend to! Thanks a lot :-)

    For the record, here is a "template" snippet if anyone wishes to do the same:

    // Hide specific ticket forms.
    document.addEventListener("DOMContentLoaded", function() {
    // Remove the forms from the drop-down selector
    document.querySelector('#request_issue_type_select option[value="TICKET_FORM_ID"]').remove();
    // Remove the options from the nesty-input after it's been created.
    document.querySelector('.nesty-panel').addEventListener('DOMNodeInserted', function(event) {
    event.target.querySelector('li[id="TICKET_FORM_ID"]').remove();
    });
    });

    Thanks again to Kay for the help!

    Regards

    0
  • Chris Boerger

    Hi all,

    It would be great to have this as native function. Being able to hide or show a form based on organisation would great to have without going to the code. Is there any plans for this? 

    1
  • Saeleum

    Hi Robbert, 

    I think I don't have ticket form ID. I can have one ticket form as I am on Support Professional. I do really need to hide the ticket form based on user's organization. How can I achieve this without ticket form ID? or how can I find the ticket form ID? 

    0
  • Samuel Mosher

    Are there plans to introduce native access controls to ticket forms? Using jQuery is fine on the surface (we use it currently!) but it's really just security through obscurity. Anyone can access the developer console in their browser, find the form ID, and then plug it into the URL. The same would be true with hiding and replacing the form picker, as the form selector is built into the {{request_form}} helper.

    This is especially problematic for those who might have "unadvertised processes" in their org that necessitate ticket forms - how do you keep them from finding out, except build the form outside Zendesk?

    0

Please sign in to leave a comment.

Powered by Zendesk