Question
How can I hide or remove the subject and description fields on the submit a request form in the help center?
Answer
You can hide the Subject from your request form. However, the Description field cannot be hidden by default.
To hide the subject field from the request form
- Go to Admin Center > Objects and rules > Tickets > Fields.
- Open the Subject field.
- Under Permissions, select Customers can view.
- Select Save.
Customers won't see the subject field in the request form, but the field is visible in the customer portal.
When you use the Customers can view permission, the description of the ticket becomes the subject of the ticket.
235 comments
Shobbir Ahmed
ok thanks Ifra Saqlain - I look forward to your response.
0
Rob Lees
I am running into difficulty understanding the steps in this guide and the information provided in the comments. One of my colleagues had tried the following code in our script.js files
We initially wanted to hide the description on one of our forms, I now see multiple situations where we need to hide fields due to limitations with the Light Agent commenting and the Help Center.
I'd like to hide the description and the CC fields on different forms. This script currently resides at the bottom of our script.js file. We do not have JQuery installed and I am not a developer, any advice would be appreciated.
1
Rob Lees
Adding JQuery was the part we were missing, I am now hiding the description, attachment upload, and CC on another form utilizing the code I posted previously with the minified JQuery in the document_head.hbs file.
1
Shobbir Ahmed
Hey Ifra Saqlain - thanks for all your help. Just checking if you've managed to have a look at my recent comment?
0
Ifra Saqlain
Hi Shobbir Ahmed,
Try this. By default, the description box is showing for your 'Standard Request' form.
Remove the previous script code and paste this new given code.
You only need to remove '00000', '11111', '2222', etc, and add the rest of the 5 forms IDs that would be shown in your search engine bar (as I mentioned in my previous comment).
Select the form instead of 'Standard Request' in your dropdown bar:
You will get the ID of your form:
Remove the '00000' from the script code and paste the form ID.
Do the same for, the second form, remove '11111' and copy your second form ID and then paste that.
Do the same for, the third form, remove '22222' and copy the form ID from the search engine bar and paste that.
Do this for all your rest forms except the 'Standard Request' form because the ID of this form isn't showing in the search engine, right?
Try this and let me know, hope it worked :)
Thanks
0
Shobbir Ahmed
Hey Ifra Saqlain
Thanks for getting back to me.
Unfortunately I can't see the id's for any of my forms:
https://rewardinsight.zendesk.com/hc/en-gb/requests/new
Please have a look for yourself.
Thanks
0
Ifra Saqlain
Okay, I saw the request page, remove the previously shared script code and only copy-paste the below code:
and let me know because it's working on my request forms.
0
Shobbir Ahmed
Hey Ifra Saqlain,
This is what I now see:
The description is removed from all the forms, I want it to show for ONLY the standard form - is this possible?
Thanks
0
Ifra Saqlain
Try this new snippet:
Both snippets are working for me.
OR
Try this one: Add at the bottom of script.js file
0
Shobbir Ahmed
Thanks Ifra Saqlain - Unfortunately now the description box is hidden for all the forms:
I just need the description field to show for only the 'Standard request' form.
This is the code I copied:
document.addEventListener("DOMContentLoaded", function () {
function checkTicketId(){
var descriptionWarpper = document.querySelector('.form-field.request_description');
var descriptionField = document.querySelector('#request_description');
var descriptionLabel = document.querySelector(".form-field.text.required.request_description > label");
const nestyInput = document.querySelector('a.nesty-input');
if (nestyInput.textContent.includes('Standard Request')) {
descriptionLabel.innerHTML = 'Description';
descriptionWarpper.style.display = "block";
}
if (!nestyInput.textContent.includes('Standard Request')) {
descriptionWarpper.style.display= "none";
descriptionField.innerHTML = "Hello Zendesk!"
}
}
checkTicketId();
});
0
Sam
Hi Shobbir Ahmed! It looks like the "Standard Request" is not actually a new ticket form, but rather a dropdown ticket field that's included on your standard ticket form. You'll want to use the code sample below that applies to the type of description field you use.
Your Description field type can be found on the new_request_page.hbs, and will either show as:
If yours does not have wysiwyg=true, you'll want the standard code. If you do have wysiwyg=true, use the "rich" code block towards the bottom.
If you use the standard non-TinyMCE "rich" description field:
If you use the TinyMCE "rich" description field:
You will need to replace CUSTOMFIELDID with the ID for your "Type of request" ticket field, and the CUSTOMFIELDTAG with the tag that matches "Standard Request."
Both of the above can be found by going to Support -> Admin Center -> Objects and rules -> Tickets -> Fields.
In the above example, you'll replace the Hello Zendesk! portion with whatever you want the box to say. It will replace it with a blank value if anything other than the Standard Request form is selected.
0
Shobbir Ahmed
Hey Sam,
Thanks for your help, unfortunately the description box is still showing for all forms:
Above is the code I copied.
I used this field ID:
Any ideas on why it isn't working?
0
Sam
Hi Shobbir Ahmed! There's an extra spot for CUSTOMFIELDID that you'll need to also replace, near the top, in this line:
0
Shobbir Ahmed
Aah, my bad!
Thank you very much for your help! It is now all working :)
0
Shobbir Ahmed
Hey Sam / Ifra Saqlain
I want to make one final change to autofill the description differently based on the choice, this is my code:
$(document).on('change', '#request_custom_fields_4798476348945', function() {
hideDescription();
});
function hideDescription() {
var selected = $('#request_custom_fields_4798476348945').val();
if (selected = "standard_request") {
$('.form-field.request_description').show();
$('#request_description').val('');
}
else if (selected = "access_request") {
$('.form-field.request_description').hide();
var descText = 'This is an Access Request';
$('#request_description').val(descText);
}
else if (selected = "software_request") {
$('.form-field.request_description').hide();
var descText = 'This is a Software Request';
$('#request_description').val(descText);
}
else if (selected = "external_access_request") {
$('.form-field.request_description').hide();
var descText = 'This is an External Access Request';
$('#request_description').val(descText);
}
else if (selected = "new_starter_form") {
$('.form-field.request_description').hide();
var descText = 'This is a New Starter Form';
$('#request_description').val(descText);
}
else if (selected = "leaver_form") {
$('.form-field.request_description').hide();
var descText = 'This is a Leaver Starter Form';
$('#request_description').val(descText);
}
}
Unfortunately it is now showing the description box in all options - any help?
Thanks
0
Sam
Hi Shobbir!
Instead of using “else if” just try “if” - that’s how we use it in our environment!
0
Shobbir Ahmed
Hey Sam
That has semi-worked:
Only problem now is that we get the same message for each type of request:
Should say this is a software request
Should say this is an access request.
Code below:
$(document).on('change', '#request_custom_fields_4798476348945', function() {
hideDescription();
});
function hideDescription() {
var selected = $('#request_custom_fields_4798476348945').val();
if (selected = "standard_request") {
$('.form-field.request_description').show();
$('#request_description').val('');
}
if (selected = "access_request") {
$('.form-field.request_description').hide();
var descText = 'This is an Access Request';
$('#request_description').val(descText);
}
if (selected = "software_request") {
$('.form-field.request_description').hide();
var descText = 'This is a Software Request';
$('#request_description').val(descText);
}
if (selected = "external_access_request") {
$('.form-field.request_description').hide();
var descText = 'This is an External Access Request';
$('#request_description').val(descText);
}
if (selected = "new_starter_form") {
$('.form-field.request_description').hide();
var descText = 'This is a New Starter Form';
$('#request_description').val(descText);
}
if (selected = "leaver_form") {
$('.form-field.request_description').hide();
var descText = 'This is a Leaver Form';
$('#request_description').val(descText);
}
}
0
Sam
Hi Shobbir Ahmed! Apologies for the delay. Please ensure you are using double-equals signs in each if statement. They should read like so:
Let me know if that takes care of it for you. I was able to replicate your behavior in my test environment when using single = symbols in the if statement.
Thanks!
0
Ifra Saqlain
@Shobbir Ahmed, happy to hear that you get your solution by @Sam.
My bad! I should have thought about custom field IDs.
0
Shobbir Ahmed
That has worked perfectly, thank you both!
0
François Bellavance
I am able to hide fields from my main help page but no on my other brands. Is there something else to do in this case? Like specifying wich brand it applies?
0
Dave Dyson
Have you added this Javascript code to each of your brands' themes?
0
François Bellavance
I added it at least on the brand theme I want these to be hidden. I have 3 brand themes actually.
0
Ifra Saqlain
Hey François Bellavance, :)
You need to add the JS code all of your 3 brand themes or if you have already done this and not getting the same solution then share your URLs here to see the bug.
You can check your console of dev tool.
Thanks
0
François Bellavance
Hi Ifra.
You mean I can copy/paste the link of my pages here? They are not public though except one.
Here is the master one :
0
Ifra Saqlain
Hi François Bellavance. :)
Yes, I was talking about it. Do the same for all your brand's theme script.js files.
Thanks
0
François Bellavance
Ifra Saqlain
You mean replace all the built in script.js from the other brands with the same that I have in my master brand? Because when I just add the same code lines, it do not work at all.
0
François Bellavance
I have done it and the subject, description and attachment fields are still there.
0
Ifra Saqlain
Make sure your all brand's theme have jQuery CDN at your document_head.hbs file.
Your code should work.
Check your console in dev tool if there is any bug, share the screenshot here.
eg. Screenshot
And,
make sure form's ID would be same for all three brand's theme.
Thanks
0
François Bellavance
Hi Ifra Saqlain
It all worked perfectly. I now just need to find how to hide the CC part, followers do not hide CCs.
0