Hide Specific Dropdown Values | The place for Zendesk users to come together and share
Skip to main content
September 1, 2023
Question

Hide Specific Dropdown Values

  • September 1, 2023
  • 19 replies
  • 112 views

I am looking to hide specific dropdown values based on a form selection.

We use a form by product approach and for a specific product we only want the option to select High or Urgent as the priority.

Is this possible? 

19 replies

Ifra
Community Expert
May 5, 2024

Noelle Cheng, okay I can try to solve this query, please share that link.

Thank You
May 7, 2024

@ifra Thank you so much! Looks like someone was able to help me out on it and their suggestion worked. I really appreciate all your contribution and help!

Jihoon11
Community Expert
August 8, 2024

Hi. Ifra Saqlain

 

Currently, 'DOMNodeInserted' is not available as per the comment below, so the solution you mentioned does not work.

 

https://support.zendesk.com/hc/ko/community/posts/4409217680410/comments/7741431026074

 

Have you found any clever way to solve this? I really need your help.

Ifra
Community Expert
August 9, 2024

Hi 이지훈(Lee jihoon),

 

Please explain your use case so I'll customize the code.

 

Thanks

Thank You
Jihoon11
Community Expert
August 13, 2024

Hi Ifra Saqlain.

 

I tried the code below and it worked in July.

My savior~! 

Is there any way to solve this?

 

$(document).ready(function() {
  removeOptions();
});


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

if (window.location.href.indexOf("900000000000") > -1) { // Ticket form ID for hide the drop down option
  var optionsToRemove = [etc', 'voc']; // Ticket field option tag
	removeOptions();
}

 

 

 

 

 

Jihoon11
Community Expert
August 13, 2024

And in this code, the ticket form ID and tag are anonymized.

Ifra
Community Expert
August 19, 2024

Hi Lee, 

 

You missed the inverted coma, try this and let me know :)

$(document).ready(function() {
  removeOptions();
});


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

if (window.location.href.indexOf("900000000000") > -1) { // Ticket form ID for hide the drop down option
  var optionsToRemove = ['etc', 'voc']; // Ticket field option tag
	removeOptions();
}

 

Thanks

Thank You
Zach36
March 11, 2025

@Ifra Saqlain, I have added this snippet at the bottom of my script.js but am still seeing the option in my drop-down… Any suggestions?

function removeOptions() {
 $('.nesty-panel').on('DOMNodeInserted', function(e){
   for(var i in optionsToRemove) {
       $('li#' + optionsToRemove[i]).remove();
   }
 });
};
if (window.location.href.indexOf("11122233344456") > -1) { // Ticket form ID for hide the drop down option
 var optionsToRemove = ['my_field_value_tag']; // Ticket field option tag
    removeOptions();
}

11122233344456 is the Form ID placeholder and my_field_value_tag is the value tag for the option in the field I want to hide

Elaine14
Employee
June 14, 2025
Hi Zach,
 
It looks like you've done a good job setting up the snippet! One thing to double-check is whether the value in optionsToRemove matches the exact value in your dropdown. Additionally, make sure that the $('.nesty-panel') selector is targeting the correct element.
 
If you still experience issues, try logging to the console to see if the function is being called and if the correct options are being identified for removal. 
 
I hope that helps!