I'm trying to get a form in Zendesk that on submit the subject and description get filled out by a custom form field. I've tried two methods so far of trying to do this but I haven't had luck with either.
The first method is was recommended here https://support.zendesk.com/hc/en-us/articles/115002860148-Disabling-the-subject-and-description-fields-on-the-new-request-form-in-Help-Center-
I added JQuery to the site via the document_head.hbs and used similar code to what was recommended. This is what is on the source above
$('.form-field.string.optional.request_subject').hide();// Hide subject
$('.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
I'm trying to replace the description and subject with a custom field value so I followed the advice of what another individual in the post said.
$('.form-field.string.optional.request_custom_fields_360000410968').hide();// Hide Custom Field
So trying to account for those few changes my code came to this.
$('.form-field.string.required.request_subject').hide(); // Hide subject
$('.form-field.request_description').hide(); // Hide description
$('#request_subject').val('.form-field.string.required.request_custom_field_1500001768241'); // Autofill subject
$('#request_description').val('.form-field.string.required.request_custom_field_1500001768241'); // Autofill
Using this code, the description value is still visible and instead of filling description with the value that is inserted by the user into the custom field it inserts a string.
form-field.string.required.request_custom_field_1500001768241
As I was unable to get the field hidden, and I was having issues grabbing the other value I tried method two.
This method involves using more of the sites features. There are suggestions involving using an HTTP or URL Extension.
I created an HTTP Extension to PUT to this URL
https://*My Subdomain*.zendesk.com/api/v2/tickets/{{ticket.id}}.json
This extension is triggered by a site trigger that activates whenever a ticket is created. When the trigger activates it runs a JSON statement. In the JSON I put
{"ticket": {"subject": "{{ticket.ticket_field_1500001768241}}"}}
This isn't working either. I'm not sure what other steps to take so I'd appreciate any assistance that can be offered. Thank you.
In order to make sure that the code runs after the page has finished loading, add it to the script.js in your theme, inside the 'DOMContentLoaded' event listener, like so:
document.addEventListener('DOMContentLoaded', function() {
$('.form-field.string.optional.request_subject').hide();
$('.form-field.string.required.request_subject').hide();
...
Assigning the value of a field to another field
What you are doing here is passing a string to the .val() method. In order to pass the value of another field you should use this syntax:
$('#request_subject').val($('#request_custom_fields_1500001768241').val())
See https://api.jquery.com/val/ for more details about how to use .val()
Adding an event handler
Finally, if you just add the code above to your script.js, it will run only once when the page loads and not when the user types in the custom field or submits the form. In order to fix this, wrap the previous line of code in an event handler, which will then run that code again each time a certain event (e.g. the value of a field changes) occurs.
$('#request_custom_fields_1500001768241').on('change', function() {
$('#request_subject').val($('#request_custom_fields_1500001768241').val());
$('#request_description').val($('#request_custom_fields_1500001768241').val());
});