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

Have more questions? Submit a request

45 Comments

  • Brett - Community Manager
    Comment actions Permalink

    Hi Hari,

    Within the Support dashboard you should be able to navigate to Admin>Channels>Widget and choose the custom fields you'd like to display within your Web Widget. Screenshot below:

     

    I would recommend toggling off any fields you'd like to remove from your widget and then hit save at the bottom of the page. More information in our Using custom ticket fields and ticket forms with the Web Widget article which I've linked for you.

    Let me know if that doesn't get you what you're looking for.

    Thanks!

    0
  • Christer Bangen
    Comment actions Permalink

    Would it be possible to hide the system field "description" until last "custom field" in the form is answered?

    0
  • Socorro Fernandez
    Comment actions Permalink

    Hey Christer!

    You could hide the description field until the last custom field you have in a form was answered. The set up of the script will depend on how many forms you have and if you want this functionality across all forms or not.

    Here is a link to another post I did on this thread that should hopefully get you started:

    https://support.zendesk.com/hc/en-us/articles/115002860148/comments/360001344888 

    Let me know if you run into any issues or have any questions regarding your specific use case.

    0
  • Erin McBride
    Comment actions Permalink

    Hey everyone!

    I don't believe this question has been asked yet, but if it had and I overlooked it I apologize.

    We have successfully been able to hide form fields and change the labels using the jQuery functions listed in previous responses. However, if a form has required fields and the user submits the form without filling out the fields the form reverts back and no longer shows our changes.

    We saw that when this occurs, the URL changes to "https://zengisticshelp.zendesk.com/hc/en-us/requests" regardless of which form was submitted. Since the URL no longer contains the form ID that we used in our if statement (ie. if (ticketForm == 360000435732) {} ) the changes are no longer applied to our form, which is causing confusion.

    Is there a way to get around this? Perhaps adding our jQuery if statement and functions to another file other than scripts.js?

    0
  • Socorro Fernandez
    Comment actions Permalink

    Hi Erin,

    It sounds like you may only have change functions in your script so when the page refreshes, those scripts don't run because nothing changed on the fields you referenced in your scripts. The URL will change on the page refresh as you mentioned but this shouldn't impact your scripts, as long as the the scripts are referencing the fields.

    I answered an example of this on an earlier post but I am not 100% if it is applicable to you.

    I gave an example of how you would want to add an if statement to the .ready portion of the JS, in addition to the .change script.

    Here is the link to that comment, specifically looking at the first 2 code snippets in there:

    https://support.zendesk.com/hc/en-us/articles/115002860148?page=1#comment_360000915147 

     

    I am more than willing to explore this further with you to make sure we can get your scripts working as you need. Thanks!

    1
  • Erin McBride
    Comment actions Permalink

    Hi Socorro,

    Thanks for your reply! I tried adding a version of what you suggested in your previous response but it did not work. Here is our current code within our .ready portion of the JS: 

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


    if (ticketForm == 360000435732) {
      $('#request_subject_label').text('Customer Name');//Changes the subject label text to 'Customer Name'
      $('#request_description_label').text('Customer Address');//Changes the description label text to 'Customer Address'
      $('#request_description_hint').text("Please enter the customer's address above. A member of our support staff will respond as soon as possible.");//Changes the hint text to match the new label
      $('.request_custom_fields_360019821771').hide();
    }

     

    When the form is submitted without the required information, the URL changes from "https://zengisticshelp.zendesk.com/hc/en-us/requests/new?ticket_form_id=360000435732" to "https://zengisticshelp.zendesk.com/hc/en-us/requests" and because that form id is no longer present our changes are no longer applied.

    0
  • Socorro Fernandez
    Comment actions Permalink

    Hi Erin,

    Thank you for the additional information!

    Since you are using the location.search.split for your variable, that in fact is looking for the url value and since the url changes when the page refreshes, this is why the scripts won't run again.

    Rather than using that variable referencing the url, you could reference the ticket form drop down ID. This code worked for me when putting in the .ready JS. The code in bold is where you put the ticket form ID: 

    if ($("#request_issue_type_select").val() == "360000435732") {
    $('#request_subject_label').text('Customer Name');//Changes the subject label text to 'Customer Name'
    $('#request_description_label').text('Customer Address');//Changes the description label text to 'Customer Address'
    $('#request_description_hint').text("Please enter the customer's address above. A member of our support staff will respond as soon as possible.");//Changes the hint text to match the new label
    $('.request_custom_fields_360019821771').hide();
    }

    Please let me know if you run into any issues with this script.

    1
  • Erin McBride
    Comment actions Permalink

    That worked! You are a genius sir. Thank you very much for your help Socorro.

    1
  • Socorro Fernandez
    Comment actions Permalink

    Happy to hear it!

    Feel free to reach out if you need to tackle any others. Thanks again for sharing!

    1
  • Paul Bendzko
    Comment actions Permalink

    All the above really helped me a lot, thanks. Hiding and again displaying the Description field is working fine now.

    What i try do is to simply only display a Text, if a certain point in a dropdown has been picked.

    E.g. when i have a tickbox or a word in a dropdown i want to display an info text only - is there any way?

    Thank you!

    0
  • Alex Gillum-Webb
    Comment actions Permalink

    Hi Socorro,

     

    First of all thanks for your input here, its helped me greatly. I'm trying to get the field validation for a serial number in a submit a request form. Its working, however i'm unable to get focus back on the input box after clicking ok on the alert - it moves on to the next box.

    Code section:

     $("#request_custom_fields_360002836618").change(function () {
    var serialno = $('#request_custom_fields_360002836618').val();
    if(/[0-9][0-9]-[A-Z].[0-9][0-9][0-9][0-9]/.test(serialno)) {
    }
    else
    {
    alert('Please input a valid Product Serial Number');
    $("#request_custom_fields_360002836618").select(); //This will set the focus back to the field
    }
    });

    I've tried with focus too, which hasn't helped - as I understand, the script pauses until ok is clicked on the alert - been wracking my brain but can't find a way around it.

     

    Any pointers would be most appreciated!

     

    Cheers

     

     

     

    0
  • Socorro Fernandez
    Comment actions Permalink

    Hi Alex,

    You are most welcome and glad to hear posts are helping out!

    It sounds like even the field fails the validation through the script and though we get the alert, its allowing users to still move on to the next field. This would be true because the script is looking for another change and the field did not change after the initial run of the script.

    A work around may be that we go ahead and clear the field if the validation fails so the user would need to add another value which will then have the script will run again. This would also allow the user to access other fields and so they are not locked to the serial number field and could go back to it when they are ready.

    All I am adding to your script is the line in bold which clears the field:

    $("#request_custom_fields_360002836618").change(function () {
    var serialno = $('#request_custom_fields_360002836618').val();
    if(/[0-9][0-9]-[A-Z].[0-9][0-9][0-9][0-9]/.test(serialno)) {
    }
    else
    {
    alert('Please input a valid Product Serial Number');
    $("#request_custom_fields_360002836618").val('');
    $("#request_custom_fields_360002836618").select(); //This will set the focus back to the field

    }
    });

     

    If you do not want this experience, please let me know and we can figure something out. Thank you!

    0
  • Socorro Fernandez
    Comment actions Permalink

    Hi Paul,

    Glad to hear things are working out for you!

    As far as the text you want to display, do you want text to show in the ticket form? as an alert? please let me know what you would like, feel free to include some screenshots.

    0
  • Paul Bendzko
    Comment actions Permalink

    Hey Socorro, thank you very much.

    I like to have it similar to the below one on my screenshot.

    Once i pick a topic in the dropdown, i just want, that a text is displayed to the end-user.

    0
  • Alex Gillum-Webb
    Comment actions Permalink

    Hi Socorro,

    Thanks for the suggestion! Turns out the behaviour works as intended with Chrome (Version 76.0.3809.132) - focus stays on the correct window that failed validation, but it doesn't work on Firefox (68.0.2) where I was doing initial testing on - focus always moves on to the next field window, even after resetting the value.

    Should be able to work around this for intended use - but would you know of a simple resolution?

    I did have another query - I have 4 more field values that I want to perform validation on (if value is inputted only , as not all are required) - however in this instance, I want to validate that each one is different from the last.

    Ideally I wanted to do a check on all 4 fields after the 4th had been populated - however, there may only be 3 entries. I had been testing with the following code, checking each previous iterations for matches, but it you can force through the validation as it seems to only check once:

    // Validate Tamper serial 2 is unique from first
    $("#request_custom_fields_360002511197").change(function () {
    var tamper1 = $('#request_custom_fields_360002508358').val();
    var tamper2 = $('#request_custom_fields_360002511197').val();
    if (tamper1 != tamper2) {
    }
    else
    {
    alert('Duplicate Tamper Serial #2');
    $('#request_custom_fields_360002511197').select();
    }
    });
    // Validate Tamper serial 3 is unique from 1 and 2
    $("#request_custom_fields_360002508378").change(function () {
    var tamper1 = $('#request_custom_fields_360002508358').val();
    var tamper2 = $('#request_custom_fields_360002511197').val();
    var tamper3 = $('#request_custom_fields_360002508378').val();
    if (tamper1 != tamper2 && tamper1 != tamper3 && tamper2 != tamper3) {
    }
    else
    {
    alert('Duplicate Tamper Serial #3');
    $('#request_custom_fields_360002508378').select();
    }
    });
    // Validate Tamper serial 4 is unique from 1, 2 and 3
    $("#request_custom_fields_360002508378").change(function () {
    var tamper1 = $('#request_custom_fields_360002508358').val();
    var tamper2 = $('#request_custom_fields_360002511197').val();
    var tamper3 = $('#request_custom_fields_360002508378').val();
    var tamper4 = $('#request_custom_fields_360002511217').val();
    if (tamper1 != tamper2 && tamper1 != tamper3 && tamper1 != tamper4 && tamper2 != tamper3 && tamper2 != tamper4 && tamper3 != tamper4) {
    }
    else
    {
    alert('Duplicate Tamper Serial #4');
    $('#request_custom_fields_360002511217').select();
    }
    });

    Forgive the layman attempt! H

    How would you go about something like this? I suppose I could have another field that is a required field, inputted after these values, and have that trigger the validation of the 'Tamper label' fields?

    Once again - thanks for all your input so far.

    0

Please sign in to leave a comment.

Powered by Zendesk