Recent searches


No recent searches

Tip: How to hide blank ticket fields on customer side



Posted Jan 26, 2021

Following the creation of a personalized form, the problem we had was that the fields, subject to conditions, appeared empty in the client interface. What we wanted was to see only the fields that would have been completed.
To prevent these fields from appearing and appearing empty, we have modified the code of the Help center theme's ticket request page (request_page.hbs).
Since the value that appears when the field is empty is "-", we have made it so that it is not displayed.

#before modification

{{#each custom_fields}}
<dt> {{title}} </dt>
<dd>
{{value}}
</dd>
{{/ each}}

#after modification

#we indicate that if the character "-" is present then the field is not displayed.
{{#each custom_fields}}
{{#is value "-"}}
{{else}}
<dt> {{title}} </dt>
<dd>
{{value}}
</dd>
{{/ is}}
{{/ each}}

Hope that help!


14

12

12 comments

image avatar

Brett Bowser

Zendesk Community Manager

Hey Anne,

This is an excellent tip! I'm sure this will be super helpful to other users so thank you so much for taking the time to share this :)

0


How timely! I was trying to achieve this yesterday and couldn't.  However, it didn't work for me.  I pasted the code and published, but all the fields still show with a hyphen.  

Does this work with already solved/closed tickets, or just going forward? What am I missing?

0


Hello there John, upon checking the code it seems the closing tag for the and has some spaces that can be removed. Can you try removing the spaces? Cheers!

2


When I tested it the dash symbol from the code didn't work. So I had to copy the actual dash symbol from the Help Center into the code. Then it started to work.

3


First @... you are a rockstar for this. You deserve a taco 🌮! I use several conditional fields and it makes for an ugly output end user side if they are not hidden. 

Second to echo the two seperate comments above:
@... Ram is correct, the original example code given does have spaces that need be removed for the closing {{/is}} and {{/each}} tag.

@... the reason the normal hyphen did not work when you typed it vs copy is because it is actually an em-dash. Which is basically a fancy way of extending the normal hyphen length. The em-dash can be entered vs needing to copy/paste it. For Windows you can insert one of the following ways (I do not Mac so I do not know those instructions, but I am sure it can be found on Google if needed):

1. Press Ctrl + Alt + minus key (-) on number pad (doesn't work on a laptop).
2. Use the windows alt code (not convenient).
3. Press the Windows key () + period (.), select Ω and scroll to select the em-dash to the right of the regular hyphen. (This is the easiest to remember if you use both a desktop and laptop).

Replacing the original custom fields code with the below in the request_page.hbs template, worked as expected and hides the custom fields with a blank value. Make sure you are not accidently editing the requests_page.hbs template. 

{{#each custom_fields}}
{{#is value "—"}}
{{else}}
<dt>{{title}}</dt>
<dd>
<span>{{value}}</span>
</dd>
{{/is}}
{{/each}}

Hope this clarified a few things for those with questions, but this works great!

1


Thanks! This is amazing! One question - checkboxes on a form show No instead of — Has anyone figured out how to hide those as well? I'm hesitant to add a {{#is value "No"}} as we have some dropdowns which are Yes/No and should show.

EDIT: Worked on it a bit, and was able to achieve the desired result with this code (caveat - it will hide unchecked checkboxes, if that was something you wanted to see. We don't, since all checkboxes are required conditionally on these forms!):

{{#each custom_fields}}
{{#is type "checkbox"}}
{{#is value "No"}}
{{else}}
{{#is value "—"}}
{{else}}
<dt>{{title}}</dt>
<dd>
<span>{{value}}</span>
</dd>
{{/is}}
{{/is}}
{{else}}
{{#is value "—"}}
{{else}}
<dt>{{title}}</dt>
<dd>
<span>{{value}}</span>
</dd>
{{/is}}
{{/is}}
{{/each}}

4


@... you are a life-saver my friend! Thank you very much! It works just fine.

0


Hi Sam, 

Thanks for sending me over to this post its brilliant and has answered my other question about how to hide blank fields. 

Is there a way to edit the questions to line up with the about questions, if you notice in mine the question Request type has no space after it, so the two words are joined, 

Request TypeStandard Request. I tired editing the field name but that didnt seem to work. It looks messy from an end user point of view, any help is appreciated. 

0


HI Paul Hughes! This looks like an issue with the CSS. I'm not able to sign into your help center to view a test request I submitted since it is protected by SSO.

In your request_page.hbs code, could you post the section pertaining to request-details? It should be the block sandwiched between request-collaborators and attachments

0


Just wanted to say I added this into our instance and it solved a big problem. We recently added a lot of extra conditional fields and the requests screen was looking quite messy. If either an admin or the original poster could edit the original post with the minor adjustments suggested, that would be very helpful for others who need this. Many thanks though!

0


Does this hide on the left-hand side ticket panel for agents. This is where I would like to hide all the empty fields?

0


Please sign in to leave a comment.

ADDITIONAL CONTENT

More about

Didn't find what you're looking for?

New post