Hi Ifra Saqlain

Thank you so much for your immense help to the community.

I'm attempting to hide the subject and description fields, and automatically fill them with default text if only one value from a drop-down list is selected.

I've succeeded in making it work for the subject, but I'm struggling to find a way to auto-fill the description (so I've omitted it from the code below). Could you please assist? (maybe there's a simpler way to do it with jQuery ?)

In the new_request_page.hbs:

<script>
document.addEventListener('DOMContentLoaded', function() {
  // Custom field you want to listen
  var selectElement = document.getElementById('request_custom_fields_12368015596316');

  // Subject and Description fields
  var sujetField = document.querySelector('.request_subject');
  var commentaireField = document.querySelector('.request_description');

  // Function to hide Subject and Description fields
  function masquerChamps() {
    sujetField.classList.add('masque');
    commentaireField.classList.add('masque');
  }

  // Function to show Subject and Description fields
  function afficherChamps() {
    sujetField.classList.remove('masque');
    commentaireField.classList.remove('masque');
  }

  // Listen to the changes in the custom ticket field
  selectElement.addEventListener('change', function() {
    var valeurSelectionnee = selectElement.value;
    // For a specific value, hide Subject and Description fields and auto fill with text
    if (valeurSelectionnee === 'désinscription_à_la_newsletter_et_sms') {
  		sujetField.querySelector('input').value = 'test subject'
      masquerChamps();
    } else {
  	sujetField.querySelector('input').value = ''
      afficherChamps();
    }
  });
});
</script>

In the style.css:

.masque {
  display: none;
}