How can I disable the subject and description fields from the request form?

Return to top

206 Comments

  • Cory Katz

    is there a way to also hide the CC field and the Attach a file section?  i played with the following code but it doesn't seem to remove the CC and Attach file, just the subject and description:  

     

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

    if(ticketForm == 360001296612) {
    $('.form-field.request_subject').hide(); // Hide subject
    $('.form-field.request_description').hide(); // Hide description
    $('.form-field.request_collaborators_').hide(); // Hide CCs
    $('.form-field.request-attachments').hide(); // Hide attachment upload
    $('#request_subject').val('New update ticket form request'); // autofill subject
    $('#request_description').val('See details in the fields to the left'); // autofill description
    }

     

    0
  • Travis Rider

    Hey Cory!

    To hide the CC field I used the following:

    $('.form-field.string.optional.request_cc_emails').hide();// Hide CCs 
    1
  • Cory Katz

    @... that worked thank you! 

     

    i was able to also hide the attachment upload section with the following:

    $('.form-field label:contains("Attachments")').hide(); // Hide label for Attachments
    $('#upload-dropzone').hide(); // Hide upload box for Attachments

    1
  • Jona Wilmsmann

    I struggle to set the value of the description field and was wondering if anyone had a similar experience:

    $(document).ready(function () {
    // Hide subject and description
    const ticketForm = $("#request_issue_type_select").val();

    if (ticketForm == 360001444300) {
    $('.form-field.string.required.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
    }
    });

    Using this code, I am able to hide both the subject and description fields, however when then submitting the form, it fails. Removing the part that hides the fields, I can see that the "Test subject" is entered into the subject field, but the description field is empty. I can also see that the reason why the submit fails is because the description field is empty.

    Does anyone have a suggestion for how to fix that?

    4
  • Cory Katz

    @... - 

    your code looks good.  I use the following and it's working for me:

    $('#request_description').val('See details in the fields to the left'); // autofill description

    have you played around with the description value?  maybe it needs to be longer than a couple words, although i doubt as i've received tickets with just a period in the description i think.

    0
  • Kuldeep Patidar

    Hey everyone!

    I don't believe this question has been asked yet in any of the articles.

    We have successfully been able to hide Subject & Description fields in HC using this code.

    try {
    // Fill in default values for the new request form and hide the attachments area
    // Associated CSS in style.css file on lines 4588-4591
    document.querySelector('input#request_subject').value = 'Product Update Request';
    document.querySelector('textarea#request_description').innerText = 'Product Update Request';
    document.querySelector('div#upload-dropzone.upload-dropzone').parentElement.style.display = 'none';
    } catch(e) { /* Not on new request page, this is fine */ }

    Since, I have passed default Subject text as "Product Update Request", so whenever customer submit a form, a ticket is created in Zendesk with Subject - Product Update Request. (screenshot attached)

    However, I'd like to customize the ticket subject so that it reads:

    Employer Name - AdvertiserID (These are the user fields already available in the form). This would be the subject in the queue.

    Also, can we have the form responses copy into the ticket so that I can read it there vs. having to just look over at the fields on the left?

    Currently the ticket itself in Zendesk isn't showing the form it is still only showing "Product Update Request" in the description.

    Can anyone please help me?

    Kuldeep

    0
  • Sam

    @... We use JSON and an HTTP target that fills in this information when a ticket is created. Be aware that using Zendesk to update Zendesk tickets through the API is not supported by Zendesk itself. To achieve this:

    1. Create an HTTP target with the following values:

    • Under Admin -> Settings -> Extensions, select Add Target
    • Select HTTP Target
    • Provide a name for your target (like Ticket ID API update)
    • Use https://yourdomain.zendesk.com/api/v2/tickets/{{ticket.id}}.json (replace 'yourdomain' with your Zendesk subdomain)
    • Method: PUT
    • Content Type: JSON
    • Basic Authentication: Enabled
    • Username: your admin email address/token (e.g. jsmith@yahoo.com/token)
    • Password: Your API token (Need a token? Go to Admin -> Channels -> API -> Settings and select "Add Token")
    • Test, then save, your target

    OR

    1. Create a Webhook target with the following information:

    • Go to Admin Center from Zendesk Products -> Admin Center
    • In Admin Center, select Apps and Integrations -> Webhooks
    • Provide the following:
    • -- Name for your Webhook
    • -- Endpoint URL:  https://subdomain.zendesk.com/api/v2/tickets/{{ticket.id}}.json
    • -- Request Method: PUT
    • -- Request Format: JSON
    • -- Authentication: Basic authentication
    • -- Username: email@domain.com/token
    • -- Password: Your API token

    2. Create a trigger that notifies the HTTP target on ticket creation

    • Set up a trigger as normal, something like Ticket = Created and Form = XYZ (or whatever values make your trigger true)
    • Under Add Actions, select Notify Target
    • If using Webhooks, select Notify Active Webhook instead
    • Select your newly created HTTP target
    • Under JSON body, use the following template:
    {
    "ticket": {
    "subject": "Your text here - {{ticket.ticket_field_12345}} -
    {{ticket.ticket_field_option_title_12345}}"
    }
    }
    • After "subject": Replace the sample text or ticket field templates to whatever you want your subject to be. We will assume that the Employer ID text field ID is 12345, and your AdvertiserID is 67890.
    {
    "ticket": {
    "subject": "Product Update Request - {{ticket.ticket_field_12345}} -
    {{ticket.ticket_field_67890}}"
    }
    }

    The above would set your ticket subject to "Product Update Request - Testing1 - 123456" based on your screenshot.

    If you need dropdown values, refer to the first block of sample code - You will need {{ticket.ticket_field_option_title_12345}} to get the value title.

    Hope this helps!

    1
  • Brandon Tidd
    User Group Leader Community Moderator
    Zendesk Luminary
    The Humblident Award - 2021

    @... - 

    Building on the great answer from @..., you can use this same method to copy the ticket fields into the description. 

    {
    "ticket": {
    "subject": "Product Update Request - {{ticket.ticket_field_12345}} -
    {{ticket.ticket_field_67890}}",
    comment": { "public": false, "body": "My Field: {{ticket.ticket_field_67890}}"}}

    Hope this helps!

     

    1
  • Kuldeep Patidar

    Great tip!

    Thanks for helping out Samuel Mosher & Brandon Tidd, It worked.. :)

    I actually customized it to append to the ticket body. This allows us to show ticket form responses in a separate line as a Private comment.

    If anyone is interested, here's the JSON:

    {"ticket": {"subject": "{{ticket.ticket_field_360042711552}} - {{ticket.ticket_field_360042711572}}",

    "comment": { "public": false, "body": "Name: {{ticket.ticket_field_22745534}} \n Segment: {{ticket.ticket_field_360042710431}}"}}}

    0
  • Patrick Bernardi

    I have been trying to program in the script.js file to request the value of the priority field but it does not work with anything i try.

    been trying

    var strPriority = $('#request_subject').val();

    or

    var strPriority = $('#request_ticket_field_1260806778829').val();

    any ideas?

     

     

    0
  • Kendall Clayton

    Hello! I am trying to populate a subject line based on the responses in two fields. The first field works just fine as it is a drop down, but I would also like to autofill with a second field that is text so that the subject reads like: 

    Form Name: "Custom Drop Down" for Customer Account Number "Text"

    1500004202322 is the custom drop down field

    1500002723962 is the text field

    Currently I have the following code and it is not working:

    <script>
    //autofills subject with drop down value of request topic and does so in this format Form Name: Value
    $(document).ready(function() {
    //field information to match with subject this one is internal support disposition
      var issuePickerTicketFieldID = 1500004202322;
    var ticketFormID = location.search.split('ticket_form_id=')[1];
    var ticketFormTitle = $('select#request_issue_type_select > option:selected').text();

    var issuePickerTicketFieldID = 1500002723962;
    var ticketFormID = location.search.split('ticket_form_id=')[1];
    var ticketFormTitle = $('text').text();


    if (ticketFormID == 1500000387101) {
    $('.form-field.request_subject').hide(); // hide subject
    $('#request_subject').val(ticketFormTitle);
    $('#request_custom_fields_' + issuePickerTicketFieldID).on('change', function() {
    var issue = $(this).next('a.nesty-input').text();
    $('#request_subject').val(ticketFormTitle + ': ' + issue + issue);
    });
    }

    });
    </script>

    0
  • Jeff Dodge

    I was able to get this to hide my custom field by using the code that was in the answer but when I go to my help center via my mobile device the custom field that is hidden on the desktop shows up on my mobile device.   Is there a different code that I need to use to have it hide on the mobile device?

    Thanks,

    Jeff

    0
  • Janaya Cassidy

    Good Afternoon!

    I'm wondering if anyone could help me with the correct code to change the 'Description' field title to a preferred alternative title e.g. Additional Information/Reason. This would allow us to customize the field and remove a similarly named field on a couple of the forms and avoid duplication. 

    Thank-you!

     

    0
  • Chris HJ Lee

    thanks

    If I want to apply it like below,
    Do I need to change script.js? Or which file should I change?

    ===========================================

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

    if(ticketForm == 215063) {
    $('.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
  • Kuldeep Patidar

    Hi Chris,

    That's correct - paste your code to line 10 before function closest (element, selector).

     

    1
  • TAN BING

    Dear All,

    I am able to set value for Subject by below script but unsuccessful for Description. Would you please help me. I was stuck here few days already. Tks very much for your help first.

    The end-user interface as below.

    The code in script.js as below.

    0
  • TAN BING

    Btw I find the "request-description" field is inside iframe as below. How can we assign a value by add coding in script.js

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

    Hey,

    I tried to solve for your first asked question:

    I am able to set value for Subject by below script but unsuccessful for Description.

     

    Ans. You can change the description easily as you have done in your code.

    1). Add jquery library on your document_head.hbs file.

    2). Add the script code on script.js file.

     

    3). Output is:

     

    Make sure the console tab into your inspect tool should be clear if there are any issue then may be that's the reason because it happens, when the console shows error for single code/line/variable in the script then below code of that code/line/variable don't work.

    Do one thing, comment all your custom code and just leave uncomment only the line you have written:

     $('#request_subject').val('test subject'); 
    $('#request_subject').css('color', 'red'); 
    $('#request_description').val('test description'); 

     

    now test working or not and let me know if not working. Then I'll try on your working theme which you will set as live.

     

    Thanks

     

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

    Hi Tan Bing,

    Here is your second answer of your second question:

    Btw I find the "request-description" field is inside iframe as below. How can we assign a value by add coding in script.js

     

    Ans. The process is same you can assign the tags and content in the val() function.

     

    Output is:

     

    If any query let me know :)

    Thanks

     

     

     

    0
  • Mona

    Hello everyone!

    I've managed to hide the subject line and description with the code suggested in this article:

    var formId = $("#request_issue_type_select").val();

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

    However the page doesn't always seem to load correctly. Sometimes the fields disappear, sometimes they do not and only disappear when you reload the page. I'm guessing the script is not being loaded correctly, but I have no idea why or how to fix it.

    I tried using document.addEventListener('DOMContentLoaded', function() {}) and
    $(document).ready(function() {}), as both of them have been suggested in the comments of this article. I get the same results for both. It's also the same across Chrome, Firefox and Microsoft Edge.

    Hope someone can help!

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

    I tried your code and working fine for me, can you share the public URL of your HC and set your working theme as Live so I can see that theme and can figure out the bug.

     

     

     

     

    Default form: no subject and description box.

     

     

    Form one: with both boxes.

    0
  • Mona

    Hi Ifra, thanks for the speedy response!

    I've been continuing trying different things yesterday and I think I found the issue already. At least I wasn't able to reproduce the bug anymore.

    The jQuery version that was loaded in our document_head.hbs was 3.5.1, I changed it to the version recommended in one of the articles here (https://code.jquery.com/jquery-3.6.0.min.js) and the issue didn't happen since.

    Hope this might help anyone who comes across this issue as well!

    0
  • Kuldeep Patidar

    Hi @... @..., I hope you guys are doing well!!

    Currently, I'm working on integration between two different Zendesk instances and I would like to ask for your kind assistance in updating one of the primary API call.

    FYI: I am following the instructions that are listed in this article.

    However, while creating the very first API i.e. "Create secure ticket" in the standard instance, I get this error {"error":"Unprocessable Entity","message":"Server could not parse JSON"}.

    Below is what I sent in API request:

    {% case 1900000485187 %}
    {% when 1900000485187 %}
    {% assign group = 360020723832 %}

    {% else %}
    {% assign group = '' %}
    {% endcase %}
    {
    "ticket":
    {
    "subject": "Test Request",
    "group_id": {{group}},
    "comment": {
    "body": "This has been done"
    },
    "requester": "abc@domain.net",
    "tags": [
    "escalated_from_standard",
    "ticket_stub_required"
    ],
    "custom_fields": [{"id": 360047087692, "value": "abc@domain.net"}]
    }
    }

    But, when I used the above code after deleting the Liquid Markup, the API functioned successfully and created a ticket in Secure Instance.

    {
    "ticket":
    {
    "subject": "Test Request",
    "group_id": {{group}},
    "comment": {
    "body": "This has been done"
    },
    "requester": "abc@domain.net",
    "tags": [
    "escalated_from_standard",
    "ticket_stub_required"
    ],
    "custom_fields": [{"id": 360047087692, "value": "abc@domain.net"}]
    }
    }

    I'm pretty sure I have something wrong with syntax, but honestly I can't get it.

    Any information that you could share would be greatly appreciated.

    Kindest Regards,

    Kuldeep

    0
  • Brandon Tidd
    User Group Leader Community Moderator
    Zendesk Luminary
    The Humblident Award - 2021

    @... -

    I think the issue is that group cannot be blank in the JSON.  In this case a default group would need to be supplied.  You can confirm by going to settings > API > Target Failures and scrolling down for details.  Hope this helps!

    Brandon

    {% else %}
    {% assign group = '' %}
    {% endcase %}
    {
    "ticket":
    {
    "subject": "Test Request",
    "group_id": {{group}},
    0
  • Brandon Geick

    I need to hide an auto fill the Subject field in a public form.  

    I need to hide my Description field.  

    0
  • Christopher Kennedy
    Zendesk Developer Advocacy

    Hey Brandon,

    The tip from this article covers accomplishing that goal. Is there a specific blocker that you're encountering?

    Thanks,

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

    Hi @Brandon Geick, as @Christopher Kennedy said the article covers which you want (See my comment above in this thread) if you have something different please share here.

    Thanks

    0
  • Kuldeep Patidar

    Hi @...,

    Thank you for your invaluable advice, I went along and it worked pretty well for me.

    0
  • Dustin Swayne

    How can I remove the 'required' attribute on a hidden field with jquery?

     

    This will hide the field and remove the asterisk but when I hit submit it gives error and says it is still required.

    $('.request_custom_fields_1260821161229').hide(); 
    $('.form-field.string.required.request_custom_fields_1260821161229').removeClass('required');
    0
  • Ifra Saqlain
    Community Moderator
    Zendesk Luminary
    Most Engaged Community Member - 2022
    Most Engaged Community Member of The Year - 2021

    Hi Dustin Swayne, you need to disable the required field from the Support forum and then you don't need to add jQuery.

    Follow the below steps to disable the required attribute:

    1). Navigate the Support forum, click the icon showing the top-right corner on the workbench, and select Support.

     

    2). Select the Ticket under Manage in the left sidebar and then you will get the ticket related fields and conditions, so you can uncheck the required option in the ticket field.

     

    If any confusion do let me know :)

    Thanks

    Ifra

     

     

    0

Please sign in to leave a comment.

Powered by Zendesk