Recent searches


No recent searches

Copenhagen v4 modifications and JS updates of request forms



Posted Sep 18, 2024

I'm trying to hide and prepopulate Subject and Description of custom request form. My template is Copenhagen v4. Suggestions found on Zendesk support site don't work. My understanding is that v4 is based on React framework and so input fields do not have hardcoded CSS and are hardly to be addressed by jQuery. I managed to create a workaround by JS function searching for DIV enclosure of specific input field by label of this field. Unfortunately, it doesn't work when JS is put into script.js (not recommended anyways), or anywhere else, like assets, header template, etc. My suspicion is that JS can't access specific DOM object because it doesn't exist at the moment of running this script. Script is running probably before React is done with rendering.

 

So, my question is, did anybody faced the same issue (v4 is fairly new) or is able to suggest how to wait for renderer to finish and run JS afterwards? E.g., how to use React hooks (useEffect, useRef) in Copenhagen v4 theme?


1

5

5 comments

image avatar

Jakub

Zendesk Customer Care

Hello Jan Slansky 
 

Templates in your help center have access to various properties. For instance, the New Request Page template includes an object named new_request_form, which contains properties based on the form requested by the user. You can utilize dot notation to retrieve information from this object.

Example:

{{new_request_form.ticket_fields}}

 


As detailed in the New Request Form Object documentation (https://developer.zendesk.com/api-reference/help_center/help-center-templates/objects/#new-request-form-object), you can access its property: ticket_fields.


ticket_fields

  • Type: Array
  • Description: An array of ticket field objects that includes all standard and custom fields of the selected ticket form.

To view the array of fields for this form, you can use the following code:

To view the array of fields for this form, you can use the following code:

 

console.log(props.requestForm.ticket_fields);


This will render the array of ticket fields for the selected form.

If you need to explore the subkeys or subproperties of the Ticket Field Object, refer to the Ticket Field Object documentation.

 

You can set the field value since the property/attribute is accessible. For example:


props.requestForm.ticket_fields[1].value = "Description from Props";


In this case, the index [1] corresponds to my description field, and this line would set its value.

 

 

 

1


Thanks Jakub! Any chance to make ticket field hidden? I mean default ticket field, like Subject or Description.

0


The following worked for me where the subject field was number 14 in my array of fields:  props.requestForm.ticket_fields[14].type = "hidden";

 

I'm having trouble doing this for the following though:

props.requestForm.cc_field.type = "hidden";  This doesn't seem to work the same.  Any ideas on how hide the cc field on certain forms?

0


Adding the following the script on the New Request page works to hide the cc field:

 

props.requestForm.cc_field = false;

 

 

0


It does, but in my case fails when submitting new request.

0


Please sign in to leave a comment.

Didn't find what you're looking for?

New post