I have a catalog item HTML variable that is populated via script. It keeps auto collapsing and even when expanded does not show entire contents (see images). I need this to auto expand to the size of the contents.
Here is the script that populates this variable:
function onChange(control, oldValue, newValue, isLoading) {
if (isLoading || newValue == '') {
return;
}
var n_type = '';
var r_type = newValue;
var sysID = g_form.getValue('notary_sys_id');
var status = g_form.getValue('commission_status');
var instructions = '<table style="border:1px Solid #4D5656; background:#F4F6F7;"><tr><td><p><strong>IMPORTANT:</strong></p>You will receive emails and reminders throughout this process from <strong>MyRedactedService (MyService@app.Redactedbank.com) </strong>please be sure to look for these emails </p><p> </p><p><span style="font-size:10pt;"><strong>INSTRUCTIONS </span>- <span style="color:red;"><i>Please read all instructions carefully<i></span></p><hr style="border: 1px solid #4D5656;" />';
if (r_type == 'add') {
g_form.clearValue('notary_sys_id');
g_form.clearValue('commission_status');
g_form.clearValue('process_expiration');
g_form.clearValue('commission_name');
g_form.clearValue('nna_physical_address');
g_form.clearValue('nna_mail_address');
g_form.clearValue('nna_previous_commission_id');
g_form.clearValue('nna_previous_commission_expiration');
g_form.clearValue('cost_center');
g_form.clearValue('application_date');
g_form.clearValue('nna_completed_info');
g_form.clearValue('training_completed');
g_form.clearValue('exam_completed');
g_form.clearValue('exam_expiration');
g_form.clearValue('commission_id');
g_form.clearValue('commission_expiration');
g_form.clearValue('oath_mailed');
g_form.clearValue('attestation_received');
instructions = instructions + '<p>Once you have submitted your request to become a notary your manager must approve the request in MyRedactedService, your order will be then submitted by the Notary Administrator. </p><p><strong>If approved:</strong></p><p>- Within one business day, the notary administrator will register your info with the National Notary Association (NNA) </p><p>- Within two business days, You will receive an email with seminar information and next steps within one day of registration. Emails from the National Notary Association (NNA) will come from </span><strong>NationalNotary.org</strong> be sure to check your junk mail . NOTE: </span>Changes to seminar dates and place must be made with Trusted Notary directly.</p><p>- The entire process must be completed within 60 days of your NNA Notary registration date</p><p> </p><p><strong>If rejected </strong> - it is because of one of these reasons:</p><p>- You have not been employed at the bank for more than 90 days<br />- Your manager did not respond to the approval request within 30 days<br />- Your manager rejected your request to become a notary</p><p> </p><p>If you have any questions please send them to <a href="mailto:%20notarymanagement@Redactedbank.com" target="_blank" rel="noopener noreferrer nofollow">notarymanagement@Redactedbank.com</a></p><p> </p></td></tr></table>';
} else if (r_type == 'edit') {
if (status == 'pending') {
n_type = 'instructions';
} else {
instructions = instructions + '<p>Please note updates made here do not udpate your National Notary (NNA) registration, please contact your notary admin at <a title="notarymanagement@Redactedbank.com" href="mailto:%20notarymanagement@Redactedbank.com" target="_blank" rel="noopener noreferrer nofollow">notarymanagement@Redactedbank.com</a> to request NNA updates</p></td></tr></table>';
}
} else if (r_type == 'renew') {
n_type = 'instructions';
} else {
n_type = '';
}
g_form.setValue('instructions_lbl', instructions);
if (n_type == 'instructions') {
var sysIDType = sysID + ',' + n_type;
var gr = new GlideAjax('NotaryInstructions');
gr.addParam('sysparm_name', 'getNotification');
gr.addParam('sysparm_query_sysIDType', sysIDType);
gr.getXML(getInfo);
} else {
instructions += '</td></tr></table>';
}
function getInfo(response) {
var answer = response.responseXML.documentElement.getAttribute("answer");
if (answer) {
var longinstructions = '<table style="border:1px Solid #4D5656; background:#F4F6F7;"><tr><td><p><strong>IMPORTANT:</strong></p>You will receive emails and reminders throughout this process from <strong>MyRedactedService (MyService@app.Redactedbank.com)</strong>please be sure to look for these emails </p><p> </p><p><span style="font-size:10pt;"><strong>INSTRUCTIONS </span>- <span style="color:red;"><i>Please read all instructions carefully<i></span></p><hr style="border: 1px solid #4D5656;" />';
longinstructions += answer.toString() + '</td></tr></table>';
g_form.setValue('instructions_lbl', longinstructions);
}
}
}
What I've tried
- Set the container to auto expand
- Set the variable to auto expand - both isolate & non isolate, both on load and on change
var field = g_form.getControl('instructions_lbl');
if (field) {
field.style.height = 'auto'; // Or specific pixels like '400px'
}- Set the variable to a the max pixels of the field - both isolate & non isolate, both on load and on change
var fieldName = 'instructions_lbl';
var el = g_form.getControl(fieldName);
el.style.height = el.scrollHeight + 'px';I could really use some help on this one
