Disabling the subject and description fields on the new request form in Help Center

Return to top

154 Comments

  • Nicole

    Thanks, Ifra Saqlain! So that was in our testing environment. I updated that, it worked perfectly, and then I moved to prod. Unfortunately, now I can't get it to work in our prod environment. Can you possibly have a look again? HC here.

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

    Hi Nicole :), I just saw the theme and all is work fine for both forms:

     

     

    I figured out one more thing, you don't have this ID (1500003176142) in your any form but you added in the code with the 'if' condition:

     

    It may be:

    1500003055661 to 1500003055361
    0
  • Nicole

    Hi Ifra Saqlain! So I am just beginning to work with this actual instance of the HC. At at the bottom of the js, I added the code found on this page. Right above what I added there was existing code that also seems to take the subject off two forms. I didn't write this portion but was equally intrigued. I tried to copy the lines and add in the new form id number but it still didn't hide the subject. 

     

     

    Now oddly enough, the form 1500003055361 was a duplicated form, reworked, and then set in place. What line number did you find that snippet you posted in the js file? I did a double take and can't find it in the js file. 

     Thank you! :) 

    Edit**

    Oh my goodness, I am so sorry! I just realized what I was doing. I was in the wrong brand HC, lol! If you didn't post about the form number changing, I probably wouldn't have realized it. I put the code in the right HC brand, and now the form has it hidden as we were looking to do. I tested things and everything seems to be working well. Thank you, as always, for your time!!!

    0
  • Bernard Ugalde

    Hi Ifra or anyone still awake,

     

    I've been trying to hide the subject and description from a specific form ID 7769763237147, which is for a specific brand, but no matter how many variations of everyone's code I've pasted and published in the script.js, I can never hide and fill them, can anyone help me?

     

    This is the code i have currently all the way at the bottom on my script.js

    var ticketForm = location.search.split('ticket_form_id=')[1];

    if(ticketForm == 7769763237147) {
    $('.form-field.request_subject').hide(); // Hide subject
    $('.form-field.request_description').hide(); // Hide description
    $('#request_subject').val('test subject'); // autofill subject
    $('#request_description').val('test description'); // autofill description
    }


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

    @Bernard Ugalde, try this type:  

    if (window.location.href.indexOf("7769763237147") > -1) {
    $('.form-field.request_subject').hide(); // Hide subject
    $('.form-field.request_description').hide(); // Hide description
    $('#request_subject').val('test subject'); // autofill subject
    $('#request_description').val('test description'); // autofill description
    }
    0
  • Bernard Ugalde

    Hi Ifra,

    Same result, they're still there

     

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

    @Bernard Ugalde, Remove that and use this:

    if (window.location.href.indexOf("requests/new?ticket_form_id=") < 1) {
    $('.form-field.request_subject').hide(); // Hide subject
    $('.form-field.request_description').hide(); // Hide description
    $('#request_subject').val('test subject'); // autofill subject
    $('#request_description').val('test description'); // autofill description

     

    Team

    2
  • Bernard Ugalde

    Hi Ifra Saqlain,

     

    That finally did it. Thank you so much.

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

    :)

    0
  • OnePartner

    Perhaps I've missed something but I'm hoping someone can help - I am successfully able to hide the subject and description fields, but if an end-user forgets to fill in a required field and clicks Submit, the fields show back up again. 

    Is there any way to validate all the required fields BEFORE the page refreshes?  Any code I can put in place to stop the subject and description fields from returning after a failed submit?

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

    Hi Eddie Sawyers, try this,

    add field IDs or classes and validate those.

    $(document).ready(function(){
      if($('#request_subject').val() == 0){
        $(".request-form input[type='submit']").click(function () {
          event.preventDefault();
        });
      }  
    });

     

    Team

    0
  • Charli Maulson

    Hi Sam

    I followed your recommendation on the first page of comments this articles to set up a webhook & trigger to updates the subject field with a title & placeholders. (https://support.zendesk.com/hc/en-us/articles/4408882841498/comments/4408894285466)


    Everything has been fine until I've got to the last bit on the trigger, where in the JSON body I'm getting a Parse error:

    Any tips on how I can rectify this please?

    Thank you so much in advance

    0
  • Mark Z

    I have been successful in getting the value input from a previous textfield and populating the Subject field with it:

          $('#request_custom_fields_1').keyup(function(e) {
            var txtVal = $(this).val();
          $('#request_subject').val(txtVal);
        });

    but I haven't been able to do it when the field is a datepicker type:

        $('#request_custom_fields_2').click(function(e) {
            var txtVal = $(this).val();
            $('#request_subject').val('Date is ' + txtVal);
        });

    It is actually pulling the value just fine, but I think the problem is with the event.  Only when I click on the label above the field does it populate the Subject field with "Date is xx-xx-xxxx" but I want the event to fire when a date is picked using the datepicker.  I have tried various event types but none of them seem to work.  

    I can't get a drop-down field to populate my Subject with values at all.

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

    Hey Mark Z,

    Try this updated code:

    Current:

    $('#request_custom_fields_2').click(function(e) {
            var txtVal = $(this).val();
            $('#request_subject').val('Date is ' + txtVal);
        });

    Note: Currently, your custom_field_2 is empty. Give it the values.



    Updated:
    var _y = new Date().toLocaleString();
    var _x = $('request_custom_fields_2').val(_y);
    $('request_custom_fields_2').click(function(e) {
      var txtVal2 = $(this).val();
      $('#request_subject').val('Date is ' + txtVal2);
    });


    Output:

     

    Team

    0
  • Mark Z

    Hi Ifra,

    Thanks for your reply.  I tried your code and at first it did not do anything and also no errors in the console, but then I think you just forgot the # on this line for the custom field:

    $('request_custom_fields_2').click(function(e) {

    I added it, but now it functions the same way as my code previously.  I mean, the Subject field does not populate with "Date is xxxx" upon selecting a date from the DatePicker, rather it populates once I click on the label of request_custom_fields_2.  I don't really understand the reason for this. 

    In other words, I click on the textfield request_custom_fields_2 to open the Datepicker... then I select a date... the selected date appears as text in this field ONLY... until I click on the label above it.  When I click on the label above the custom field, then Subject populates with the date.

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

    Mark Z, because you added click event:

     When I click on the label above the custom field, then Subject populates with the date.

    $('#request_custom_fields_2').click(function(e) {


     

    Try this: Remove click event.


    var txtVal2 = $('#request_custom_fields_2').val();
    $('#request_subject').val('Date is ' + txtVal2);

     

    My updated code with the date:

    Previous:

    var _y = new Date().toLocaleString();
    var _x = $('#request_custom_fields_2').val(_y);
    $('#request_custom_fields_2').click(function(e) {
      var txtVal2 = $(this).val();
      $('#request_subject').val('Date is ' + txtVal2);
    });


    Updated:

    var _y = new Date().toLocaleString();
    var _x = $('#request_custom_fields_2').val(_y);
    var txtVal2 = $('#request_custom_fields_2').val();
    $('#request_subject').val('Date is ' + txtVal2);
    0
  • Mark Z

    Hmm, well now it populates the Subject field with the current date and time as soon as the page loads :)

    I think it needs to run when the date is chosen in the DatePicker, but I don't know which event I can use for that.

    Same problem for a drop-down field.

    0
  • Mark Z

    Any other ideas?

    0
  • Nicole

    So if you hide the description field, I know we can auto-populate/fill the field with a static phrase. Is there a way to copy a particular field on the form into the description field instead? 

    0
  • Mark Z

    Hi Nicole,

    Yes, please see my previous comment.  You can use it to fill the subject field from a custom field with this:  

          $('#request_custom_fields_1').keyup(function(e) {
            var txtVal = $(this).val();
          $('#request_subject').val(txtVal);
        });

    You should be able to adapt this for the Description field.

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

    @Mark Z, which plugin are you using for the date-picker?

     

    0
  • Mark Z

    Ifra Saqlain No plugin, it is simply the default which is used when you select the Date field type in ZenDesk.

    0
  • Mark Z

    In case anybody is looking to get the text from a selected drop-down item:

    https://support.zendesk.com/hc/en-us/community/posts/4408860888474-Drop-Down-Menu-Value-vs-Select-Option?page=1#community_comment_5090694302618 

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

    @Mark Z, if possible share your HC URL where you are working. 

    0
  • Mark Z

    Unfortunately I can't share it as it is being used in production with user authentication enabled.  But it is a standard Date field, so you should have the same issue no matter where it is being used.  (namely, which event handler can we use for when the user chooses a date in the Date field?)

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

    No problem, I'll look at it by adding date field to my form.

    0
  • Vamshi R

    Ifra Saqlain I hope you can help me out on my issue. 

    • On our request page we have one field is hard coded in the script. Below highlighted field should be removed from this form.
    • I want hide Description field for only one form.

     

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

    Hi Vamshi R,

    Add the code to your script.js file but you need to add your form ID and field ID or class name as I mentioned below where to add.

     

    To hide description field:

     if (window.location.href.indexOf("00000000") > -1) {

    // Hide description field
    document.querySelector('.request_description').style.display= "none";
      }

    Note: Remove 00000000 and add your form ID for which form you want to hide.

     

    To hide the Email address field:

    if (window.location.href.indexOf("00000000") > -1) {

    // Hide description field
    document.querySelector('.request_description').style.display= "none";
      }

    Note: Remove 00000000 and add your form ID for which form you want to hide.
    Remove .request_description and add field ID or class.

     

    You can find your form ID in your search-bar.

     

    Team

    0
  • Vamshi R

    Hi Ifra Saqlain 

       I just used below code and now i am able to hide Description and your email address field. 

    var ticketForm = location.search.split('ticket_form_id=')[1];

    if(ticketForm == 10322663005972) {
    $('.form-field.request_description').hide(); // Hide description
    $('.form-field.request_anonymous_requester_email').hide(); // hide your email address
    $('#request_description').val('Description of Incident Activity'); // autofill description
    $('#request_anonymous_requester_email').val('vamshi.r@pro-vigil.com'); // autofill your email address
    }

    But i have one more concern, how can i populate a custom ticket field data on your email address field. Below is the screenshot of the field which i need to populate.

     

    0
  • Mark Z

    It seems to me that ZenDesk disabled many functions of jQuery.  For example not all event handlers can function with standard text fields or labels (like mouseenter), and some fields like Date do not allow any events handlers at all (that I have tried).

    It would be nice to get some documentation about this from ZenDesk but I have not found any.

    0

Please sign in to leave a comment.

Powered by Zendesk