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

Hello Eric, same for me. Worked fine until now, but now it's not working anymore. That's my code : 

I personally use a theme from Lotus, I'll also message them just in case.

var tagsToRemove = ['XXXX'];

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

Thank you.

Hello, I learned that Chrome released an update on 7/23/24, where mutation event 'DomNodeInserted'  is no longer supported by Chrome. This has caused an issue with this set up in our instance and now a client can see a form that was originally hidden from them. 

Is there an updated script we should use in this case? 

Reference Link:  https://developer.chrome.com/blog/mutation-events-deprecation

Here is the current script we have and was working originally:

<script>
 // Generic function to remove form option from form selection dropdown
 function removeFormOption(formID) {
   $('#request_issue_type_select option[value="' + formID + '"]').remove();
   $('.nesty-panel').on('DOMNodeInserted', function(e) {
       $(this).children('ul').children().remove('#' + formID);
   });
 }

Hi Eric,

Give me some time, I'll get back to you soon.

Thanks

Hi Ifra,

I've used your original code for some time now and it worked great. For some reason, today it stopped working in Chrome. Not sure why this is happening as the only changes we made were to add tags as we go, and haven't done that in recent memory. Do you have any ideas? Thanks
Code using for reference:

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

Hi Ester,

use the given code:

$(document).ready(function (){
  var currentLanguage = $('html').attr('lang').toLowerCase();
 if(currentLanguage === "es-es") {
  //Code for some specific ticket forms -- Start
  
  var tagsToRemove = ['000000000000000']; //special form ID
  
  function removeTagsWeDontWant() {
    $('.nesty-panel').on('DOMNodeInserted', function(e){
      for(var i in tagsToRemove) {
        $('li#' + tagsToRemove[i]).remove();
      }
    });
  };
  

removeTagsWeDontWant();
   
 }
});


Note: 000000000000000 remove this and add your form ID which you wanna hide.

If any issues feel free to ask :)

Thanks

Hi Gavin,

I have read your query.

Closing brackets are missing at the end of code, please add the  brackets and then still you get the same issue please let me know.

$(document).ready(function (){

  //Code for some specific ticket forms -- Start
  
  var tagsToRemove = ['16792736785805']; //special form ID
  
  function removeTagsWeDontWant() {
    $('.nesty-panel').on('DOMNodeInserted', function(e){
      for(var i in tagsToRemove) {
        $('li#' + tagsToRemove[i]).remove();
      }
    });
  };
removeTagsWeDontWant();
});

Thanks

Ifra Saqlain

I have been able to hide a ticket from from the drop-down selector using the following code...

$(document).ready(function (){

  //Code for some specific ticket forms -- Start
  
  var tagsToRemove = ['16792736785805']; //special form ID
  
  function removeTagsWeDontWant() {
    $('.nesty-panel').on('DOMNodeInserted', function(e){
      for(var i in tagsToRemove) {
        $('li#' + tagsToRemove[i]).remove();
      }
    });
  };
removeTagsWeDontWant();

HOWEVER - this is now generating a "deprecated" error in the Chrome browser console...

jquery.min.js:2 [Violation] Listener added for a synchronous 'DOMNodeInserted' DOM Mutation Event.
This event type is deprecated (https://w3c.github.io/uievents/#legacy-event-types) and work is underway to remove it from this browser.
Usage of this event listener will cause performance issues today, and represents a risk of future incompatibility.
Consider using MutationObserver instead.

I see the recommendation is to use MutationObserver instead, however I'm not skilled enough to implement this on my own.  Do you have updated recommended code to hide a form?

Ifra Saqlain that worked. You are AWESOME.

Hi Hannah Lucid :)

Your form tiles have a unique id in the code:

So, pick a class-name which tile you wanna hide as I'm selecting second form:

Copy the class name of second form tile:

seconf form-tile class-name : id-1260813066549

Now, go to the source files and add CSS code to your style.css file at the bottom, your form title will be hide

.id-1260813066549 { 
  display:none
 }

Any form tile you wanna hide, just pick the class-name and hide via CSS as I did above.

Or, If you wanna hide your tile from specific users so you can do like this:

Go to your script.js file and add the given code at the bottom area.

if(HelpCenter.user.role == 'anonymous') {
document.querySelector(".id-7333832645403, .id-9228149361307, .id-1260813066549").style.display = "none";
}



OR


if(HelpCenter.user.role == 'anonymous') {
document.querySelector(".id-7333832645403").style.display = "none";
document.querySelector(".id-9228149361307").style.display = "none";
document.querySelector(".id-1260813066549").style.display = "none";
}

If any confusion feel free to ask :)

Thanks

Ifra Saqlain Saqlain, is there a way to hide a form tile in the Guide? I tried using the coding above and was not able to remove this from our support portal:

https://rpmtest.zendesk.com/hc/en-us