We are using jQuery in a client script to add choices to a string-type field. However, this script is not working in Workspace.
Our setup is designed to support multiple customers. One customer requires a string field, while another needs predefined choices for the same field. To handle this, we created the following client script using jQuery to dynamically add choices. Unfortunately, it does not work as expected in Workspace.
Could you please advise on how to make this work in Workspace, or suggest an alternative approach?
var reqcompany = g_form.getValue('u_requested_for_company');
var ctype = g_form.getValue('type');
if (ctype == 'Pre RFC') {
//d175592d1b4530d04723a8a8b04bcb86 = Test Company
if (comp == 'd175592d1b4530d04723a8a8b04bcb86' || reqcompany == 'd175592d1b4530d04723a8a8b04bcb86') {
g_form.setMandatory('u_extrefno', true);
// Display below values on the drop down for External Ref No 1
var listOptions = ['Business System Change', 'Data Change', 'Finance System Change', 'Process Control System Change', 'Project Change', 'Request'];
var $ = jQuery;
// Once the document is ready (loaded/rendered), it's safe to manipulate elements on the page.
$(function() {
var initValue = g_form.getValue('u_extrefno'),
valueExists = false,
inputElement = $(g_form.getControl('u_extrefno')),
selectElement = $('<select class="form-control" style="direction:ltr;" ng-non-bindable="true"></select>')
.attr('id', 'choice_display.' + inputElement.attr('id'))
.attr('u_extrefno', 'choice_display.' + inputElement.attr('u_extrefno'))
.change(function() {
g_form.setValue('u_extrefno', this.value);
});
// Ensure the initial (DB) value is not null or undefined.
if (initValue == null) initValue = '';
// Add all the items to the drop-down list.
for (var i = 0, len = listOptions.length; i < len; i++) {
var optionValue = listOptions[i];
valueExists = valueExists || (optionValue == initValue);
selectElement.append($('<option></option>').attr('value', optionValue).text(optionValue));
}
// Ensure the initial (DB) value is in the drop-down list.
if (!valueExists)
selectElement.prepend($('<option></option>').attr('value', initValue).text(initValue));
// Set the drop-down list's selected value.
selectElement.val(initValue);
// Hide the original textbox and show the drop-down list in it's place.
inputElement.hide();
inputElement.after(selectElement);
});
}
Thanks,
