Hiding a ticket form on the 'submit a request' page

Answered

87 Comments

  • Ifra Saqlain
    Community Moderator
    Zendesk Luminary
    Most Engaged Community Member - 2022
    Most Engaged Community Member of The Year - 2021

    Hey Paul, I think I'm too late :).

    I found something for your query, check the organization name:-

    //This code currently blocks non-xxx users from submitting tickets

    if (HelpCenter.user.organizations[0].name !== "ORGANIZATION_NAME"){

      // Hide the graduation form from Homepage    
        
    if (window.location.href.indexOf("?ticket_form_id") > -1) {
          console.log("yes!");
        } else {
          var _x = $(".list-group > a[href*='5550538483484']").remove();
        }
        
    // Hide the graduation form  from Nesty Panel    
        
    var tagsToRemove = ['5361962484244'];  //special form ID

    function removeTagsWeDontWant() {
    $('.nesty-panel').on('DOMNodeInserted', function(e){

    for(var i in tagsToRemove) {
    $('li#' + tagsToRemove[i]).remove();
    }
    });
    };
    removeTagsWeDontWant(); 
      
    }


    Note: Remove ORGANIZATION_NAME and write your organization name here.

    Reference: https://support.zendesk.com/hc/en-us/community/posts/4529302824346-Get-the-organization-id-or-user-id-from-Zendesk-Guide

     

     

    Try this and let me know if it works.

    Thanks

     

    0
  • Jahn Bronilla
    Community Moderator
    Zendesk Luminary

    Hello Ifra Saqlain - can we possibly hide values from Ticket Type field for end user? 

    There are around 15 values selection from the ticket type field but we want to hide 2 of them. Is this possible? 

    0
  • Ifra Saqlain
    Community Moderator
    Zendesk Luminary
    Most Engaged Community Member - 2022
    Most Engaged Community Member of The Year - 2021

    Hi Jahn Bronilla,

    Type selection field means this dropdown field -

     

    If yes, you can hide.

    i). Add the below code to your script.js file.

    $(document).ready(function (){

    //Code for some specific ticket forms -- Start

    var tagsToRemove = ['00000000', '11111111'];  //special form ID

    function removeTagsWeDontWant() {
    $('.nesty-panel').on('DOMNodeInserted', function(e){
    for(var i in tagsToRemove) {
    $('li#' + tagsToRemove[i]).remove();
    }
    });
    };

    if (HelpCenter.user.role=="end_user"){
    removeTagsWeDontWant();
    }

    Note: 0000000 and 1111111 are the selection values so add your IDS here and remove 00000 and 11111.

     

     

    document_head.hbs fie:

    <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.6.3/jquery.min.js" integrity="sha512-STof4xm1wgkfm7heWqFJVn58Hm3EtS31XFaagaa8VMReCXAkQnJZ+jEy8PCC/iT18dFy95WcExNHFTqLyp72eQ==" crossorigin="anonymous" referrerpolicy="no-referrer"></script>

    Try this and let me know if it works for you :)

     

     

    Or your query is different from my solution then share screenshot to make me understand.

    Thanks

    0
  • Jahn Bronilla
    Community Moderator
    Zendesk Luminary

    Hello Ifra Saqlain - thanks for your response.

    Question though, I am not a developer but can follow this but really not sure where to insert those code/s. Is it from the very top or to the bottom? 

    0
  • Paul Hughes

    Jahn Bronilla

    Just to say, this code works but it wont hide the forms from the non authenticated users which is a pain. So its only going to hide it from users who are signed in, it defeats the purpose as most users come to my Zendesk page not signed in and then see the form I wanted to hide, after they sign in its disappears which causes confusion. 

    It would be great if I could hide the form from appearing on the homepage from non-authenticated users. 

    0
  • Jahn Bronilla
    Community Moderator
    Zendesk Luminary

    Hi Paul H - thanks for noting this one. So technically this is visible to non-authenticated users.

    Oh geez, that's not good if that's the case.

    0
  • Ifra Saqlain
    Community Moderator
    Zendesk Luminary
    Most Engaged Community Member - 2022
    Most Engaged Community Member of The Year - 2021

    Add CDN to ducument_head.js - 

     

     

    Add script code to scr.js file at the bottom area - 

    0
  • Paul Hughes

    Ifra Saqlain

    Hi Ifra, 

    Sorry im only coming back to you now, I tried that code you posted on December 9th 2022 but it didn't work for me. I wonder is there any other way around this. 

    •  
    0
  • Ifra Saqlain
    Community Moderator
    Zendesk Luminary
    Most Engaged Community Member - 2022
    Most Engaged Community Member of The Year - 2021

    Hey Jahn and Paul, your answer is here:

     

    $(document).ready(function () {

    //Code for some specific ticket forms -- Start

    var tagsToRemove = ['000000000', '111111111'];  //special form ID

    function removeTagsWeDontWant() {
    $('.nesty-panel').on('DOMNodeInserted', function(e){
    for(var i in tagsToRemove) {
    $('li#' + tagsToRemove[i]).remove();
    }
    });
    };

    if (HelpCenter.user.role=="anonymous" | HelpCenter.user.role=="end_user") {
    removeTagsWeDontWant();
    }

    // End

    });

     

     

    Try this and let me know.

     

    0
  • Jahn Bronilla
    Community Moderator
    Zendesk Luminary

    Hi Ifra Saqlain, tried and did the above you have provided and "saved" then "preview" but apparently it's not working for some reason.

    Those selection from the Ticket Type below are not hidden. It's still reflecting as a selection in here. 

    I am changing the below to the tags which corresponds the dropdown values right?

    ['000000000', '111111111']






    0
  • Ifra Saqlain
    Community Moderator
    Zendesk Luminary
    Most Engaged Community Member - 2022
    Most Engaged Community Member of The Year - 2021

    O God! 

    Jahn you need to add Form IDs here not Form Name.

    i). Select your form which is in the dropdown which you want to hide.

     

    ii). You will reach to that form and get the form id in the searchbar as I want to hide New Form so I select New Form in the dropdown and I'll get the id of New Form in the search-bar 53619...4244.

     

     

     

    iii). Copy that ID, I copied my New Form ticket ID in searchbar.

     

     

     

     

    and add to your script code instead of name.

     

     

     

     

    0
  • Jahn Bronilla
    Community Moderator
    Zendesk Luminary

    Apologies Ifra Saqlain as again I am no developer and I am really not into coding but trying me best here to follow the instruction. 

    If I use the field ID then the entire field will be hidden in which we can't since it's where the customer select their concern.

    I was able to make it work (hide) using the tags and not the form ID :). I am not hiding the whole form or ID but rather just a value from the ticket type field. 

    Thank you anyways for your help! 

    0
  • Ifra Saqlain
    Community Moderator
    Zendesk Luminary
    Most Engaged Community Member - 2022
    Most Engaged Community Member of The Year - 2021

    The above code is only hiding your value from the dropdown field for end-users and anonymous users. Not completely hiding.

     

    You want to hide your form name in the dropdown so that code will hide only.

    0
  • Jahn Bronilla
    Community Moderator
    Zendesk Luminary

    The below tags actually works. I am not just using the correct tags/values earlier hence it's not hiding
    Again, thank you for your help

     

    0
  • Ifra Saqlain
    Community Moderator
    Zendesk Luminary
    Most Engaged Community Member - 2022
    Most Engaged Community Member of The Year - 2021

    Hi Paul, The code is for non-authenticated person-

     

    $(document).ready(function () {
    //Code for some specific ticket forms -- Start

    var tagsToRemove = ['5361962484244'];  //special form ID

    function removeTagsWeDontWant() {
    $('.nesty-panel').on('DOMNodeInserted', function(e){
    for(var i in tagsToRemove) {
    $('li#' + tagsToRemove[i]).remove();
    }
    });
    };

    if (HelpCenter.user.role=="anonymous") {
    removeTagsWeDontWant();
    }
    // End

    });

     

     

    You can try this and let me know.

    Thanks

     

    0
  • Jahn Bronilla
    Community Moderator
    Zendesk Luminary

    All good now for me Ifra Saqlain. It's working even I am using tags which corresponds the value from the ticket type selection field. 

    Values we want to hide are now hidden for the end user and anonymous users. 

    0
  • Ifra Saqlain
    Community Moderator
    Zendesk Luminary
    Most Engaged Community Member - 2022
    Most Engaged Community Member of The Year - 2021

    Happy to help :)

    0
  • Paul Hughes

    Hi Ifra Saqlain

    Thanks that is working for the Nesty Panel, im still stuck on hiding it from anonymous users on the homepage also, 

    I never did find the organization name, is there a way to hide it from the homepage also using the same method as the nesty panels?

    //This code currently blocks non-xxx users from submitting tickets

    if (HelpCenter.user.organizations[0].name !== "ORGANIZATION_NAME"){

      // Hide the graduation form from Homepage    
        
    if (window.location.href.indexOf("?ticket_form_id") > -1) {
          console.log("yes!");
        } else {
          var _x = $(".list-group > a[href*='5550538483484']").remove();
        }
    0
  • Ifra Saqlain
    Community Moderator
    Zendesk Luminary
    Most Engaged Community Member - 2022
    Most Engaged Community Member of The Year - 2021

    Paul, remove the old snippet which I have provided to you before and add this new, here forms are hiding from end_users (non-authenticated users ) only on homepage and dropdown on new-request-page.

    $(document).ready(function () {

    if (HelpCenter.user.role=="anonymous") {
    // Hide the graduation form from Homepage    
        
    if (window.location.href.indexOf("?ticket_form_id") > -1) {
          console.log("yes!");
        } else {
          var _x = $(".list-group > a[href*='5550538483484']").remove();
        }
    }


    //Code for some specific ticket forms -- Start

    var tagsToRemove = ['5550538483484'];  //special form ID

    function removeTagsWeDontWant() {
    $('.nesty-panel').on('DOMNodeInserted', function(e){
    for(var i in tagsToRemove) {
    $('li#' + tagsToRemove[i]).remove();
    }
    });
    };

    if (HelpCenter.user.role=="anonymous") {
    removeTagsWeDontWant();
    }
    // End

    });
    0
  • Paul Hughes

    Hi Ifra Saqlain,

    Thanks again as usual your code works brilliantly, I managed to get that working and can now hide it from non authenticated users from the homepage and the nesty-panel.

    One thing that is confusing me, I have all my end users, and I have tags for two groups, Staff and Students, if I add hide for end users this means no one from either of those tagged groups will see it as they are end users.

    Is there a way to hide stuff from Tagged accounts? Or a way for me to actually make user roles that would then be linked to a tag? 

    I want to be able to hide something from a non authenticated user and a tagged group.

    0
  • Ifra Saqlain
    Community Moderator
    Zendesk Luminary
    Most Engaged Community Member - 2022
    Most Engaged Community Member of The Year - 2021

    Hi Paul, you can try the above solution, use form-tag instead of form-id as Jahn Bronilla did. He hides their forms from non-authenticated users. You can do like this-

    if (HelpCenter.user.role=="anonymous") {  -- This condition is for anonymous (non-authenticated) users.

    $(document).ready(function () {

    if (HelpCenter.user.role=="anonymous") {
    // Hide the graduation form from Homepage    
        
    if (window.location.href.indexOf("?ticket_form_id") > -1) {
          console.log("yes!");
        } else {
          var _x = $(".list-group > a[href*='5550538483484']").remove();
        }
    }


    //Code for some specific ticket forms -- Start

    var tagsToRemove = ['Form-Tag-Name', 'Form-Tag-Name'];  //special form ID

    function removeTagsWeDontWant() {
    $('.nesty-panel').on('DOMNodeInserted', function(e){
    for(var i in tagsToRemove) {
    $('li#' + tagsToRemove[i]).remove();
    }
    });
    };

    if (HelpCenter.user.role=="anonymous") {
    removeTagsWeDontWant();
    }
    // End

    });

     

    And if you have another way you can share with us, it's good to share ideas :)

     

     

    0
  • Paul Hughes

    Hi Ifra Saqlain,

    I think there's some confusion, I am already using the code below which hides the forms from non-authenticated users and its working fine. 

    My question is can I also hide them from users groups based on Tags? Is there a way to hide stuff from Tagged accounts? Or a way for me to actually make user roles that would then be linked to a tag? 

    I want to hide these forms from both anonymous users and a certain tagged group in zendesk?

    I will play around with the code and see if I can restrict forms from tagged user using:

    if (HelpCenter.user.tags=="student") or something similar, I just thought you might know a way

     

    $(document).ready(function () {

    if (HelpCenter.user.role=="anonymous" ) {
    // Hide the graduation form from Homepage    
        
    if (window.location.href.indexOf("?ticket_form_id") > -1) {
          console.log("yes!");
        } else {
          var _x = $(".list-group > a[href*='7446275690524']").remove();
        }
    }    
        
        
    //Code for some specific ticket forms -- Start

    var tagsToRemove = ['7446275690524'];  //special form ID

    function removeTagsWeDontWant() {
    $('.nesty-panel').on('DOMNodeInserted', function(e){
    for(var i in tagsToRemove) {
    $('li#' + tagsToRemove[i]).remove();
    }
    });
    };

    if (HelpCenter.user.role=="anonymous" ) {
    removeTagsWeDontWant();
    }
    // End

    });

    0
  • Ifra Saqlain
    Community Moderator
    Zendesk Luminary
    Most Engaged Community Member - 2022
    Most Engaged Community Member of The Year - 2021

    Hey Paul, actually I didn't try but I'll and get back to you with the solution :) for you.

    0
  • Paul Hughes

    Hi Ifra Saqlain,

    I'm wondering if you ever found a solution for my last query? I want to hide these forms from both anonymous users and a certain tagged group in Zendesk but not sure if its possible. I haven't had any luck with the code myself. 

    0
  • Ifra Saqlain
    Community Moderator
    Zendesk Luminary
    Most Engaged Community Member - 2022
    Most Engaged Community Member of The Year - 2021

    Hi Paul,

    Use the given code, add tag name:

    $(document).ready(function () {

    console.log(HelpCenter);


    if (HelpCenter.user.role=="anonymous" || HelpCenter.user.tags == "YOUR TAG NAME") {
    // Hide the graduation form from Homepage    
        
    if (window.location.href.indexOf("?ticket_form_id") > -1) {
          console.log("yes!");
        } else {
          var _x = $(".list-group > a[href*='7446275690524']").remove();
        }
      
      //Code for some specific ticket forms -- Start

    var tagsToRemove = ['7446275690524'];  //special form ID

    function removeTagsWeDontWant() {
    $('.nesty-panel').on('DOMNodeInserted', function(e){
    for(var i in tagsToRemove) {
    $('li#' + tagsToRemove[i]).remove();
    }
    });
    };
    removeTagsWeDontWant();

    // End
    }   
    });

     

    Check your console to get name of user tags via this line of code:

    console.log(HelpCenter);

     

    Hope it helps.

    0
  • Paul Hughes

    Hi Ifra Saqlain

    Unfortunately that didn't work for me but I think the reason is because no tags are being applied to my users, well at least under the console they are not.

    if (HelpCenter.user.role=="anonymous" || HelpCenter.user.tags == "USERS DIDNT HAVE TAGS UNDER CONSOLE")

    However under the organization there is users and tags.I seen another forum showing how to add in a organisation name, I tried adding this line but it didnt work: 

    if (HelpCenter.user.role=="anonymous" || HelpCenter.user.organizations[c].name == "Students") {

     

    I think if I can add in organizations users here this will work but the code I tried didn't work, I think I'm again missing something. Thanks for all your help on this, if you see something im doing wrong please let me know. 

     

    My CONSOLE:

    1. organizations: Array(1)
      1. 0:
        1. isShared: false
        2. name: "Students"
        3. tags: ['student']
        4. [[Prototype]]: Object
      2. length: 1
      3. [[Prototype]]: Array(0)
    2. role: "end_user"
    3. tags: Array(0)

     

    Current code:

     $(document).ready(function () {

    console.log(HelpCenter);

    if (HelpCenter.user.role=="anonymous" || HelpCenter.user.tags == "USERS DIDNT HAVE TAGS UNDER CONSOLE") {
      
    // Hide the graduation form from Homepage    
        
    if (window.location.href.indexOf("?ticket_form_id") > -1) {
          console.log("yes!");
        } else {
          var _x = $(".list-group > a[href*='7446275690524']").remove();
        }
      
      //Code for some specific ticket forms -- Start

    var tagsToRemove = ['7446275690524'];  //special form ID

    function removeTagsWeDontWant() {
    $('.nesty-panel').on('DOMNodeInserted', function(e){
    for(var i in tagsToRemove) {
    $('li#' + tagsToRemove[i]).remove();
    }
    });
    };
    removeTagsWeDontWant();

    // End
    }   
       
    });  

    0
  • Ifra Saqlain
    Community Moderator
    Zendesk Luminary
    Most Engaged Community Member - 2022
    Most Engaged Community Member of The Year - 2021

    Hello Paul, see you have students tag in your console. change this in the if condition;

    Try the below line of code and remove previous.

    if (HelpCenter.user.role=="anonymous" || HelpCenter.organizations.tags == 'student') {
    0
  • Paul Hughes

    Hi Ifra Saqlain

    I had tried that already, I tried a couple of combinations but none worked. Even though in the console this is a organization tag that line of code still does not hide it. 

    I was browsing and found this article below, and a piece of code I found actually does hide forms from students, but this code only shows how to how from the nesty input. I also want to hide on the home page. I tried using some of this code in my current code but no joy.  

    Example: (HelpCenter.user.organizations[c].name === "Students")

    https://support.zendesk.com/hc/en-us/articles/4408886229146?page=2#comments 

    $(window).on('load', function() {
     var i = 0;
     var checkExist = setInterval(function() {
     i++;
     if ($("a.nesty-input").length){
     clearInterval(checkExist);
     $("a.nesty-input").each(function() {
     $(this).bind( "click", function() {
     for (var c in HelpCenter.user.organizations) {
    if (HelpCenter.user.organizations[c].name === "Students"){
    $("#7446275690524").remove();
     } 
     
     //reserve space for additional organizations 
     }
     
     });
     });
     }
     if (i > 10){
     clearInterval(checkExist);
     }
     }, 100);
    });

    0
  • Ifra Saqlain
    Community Moderator
    Zendesk Luminary
    Most Engaged Community Member - 2022
    Most Engaged Community Member of The Year - 2021

    So try this:

     

    currently you have this:

    $(window).on('load', function() {
     var i = 0;
     var checkExist = setInterval(function() {
     i++;
     if ($("a.nesty-input").length){
     clearInterval(checkExist);
     $("a.nesty-input").each(function() {
     $(this).bind( "click", function() {
     for (var c in HelpCenter.user.organizations) {
    if (HelpCenter.user.organizations[c].name === "Students"){
    $("#7446275690524").remove();
     } 
     
     //reserve space for additional organizations 
     }
     
     });
     });
     }
     if (i > 10){
     clearInterval(checkExist);
     }
     }, 100);
    });

     

     

    try this new snippet instead of above:

    $(window).on('load', function() {
     var i = 0;
     var checkExist = setInterval(function() {
     i++;
     if ($("a.nesty-input").length){
     clearInterval(checkExist);
     $("a.nesty-input").each(function() {
     $(this).bind( "click", function() {
     for (var c in HelpCenter.user.organizations) {
    if (HelpCenter.user.organizations[c].name === "Students"){
    $("#7446275690524").remove();
     } 
     
     //reserve space for additional organizations 
     }
     
     });
     });
     }
     if (i > 10){
     clearInterval(checkExist);
    }

    }, 100);

    // Hide form from Homepage  
     
    if (window.location.href.indexOf("?ticket_form_id") > -1) {
     for (var c in HelpCenter.user.organizations) {
    if (HelpCenter.user.organizations[c].name === "Students"){
          console.log("yes!");
        } else {
      var _x = $(".list-group > a[href*='Form ID FROM CONSOLE']").remove();
        }
    }
    }
    });




    Copy form ID from anchor tag in your console on homepage.






    0
  • Paul Hughes

    Hi Ifra Saqlain

    I have got through the console and code and don't seem to have any anchor tags, I'm assuming these are hidden, I'm not sure how to find these but I will keep trying. 

    0

Please sign in to leave a comment.

Powered by Zendesk