How to add a reference field when clicked on a UI Action

[Akhila Vangala]

When clicked on a UI action, here for Example we can take 'Promote to Major Incident', it already has pre-defined fields populated which are Work notes and Business Impact.

My Query is how can I populate 'Service' which is a reference field of 'cmdb_ci_service' Table and make this field mandatory on that dialog window which shows up.

If it is a text field it would have been easier, but as this is a reference field how to customize the Ui Actions and UI Page.

This is related to Major Incident Management, if not found in your instance kindly install 'com.snc.incident.mim', so you can find these UI Actions and UI Pages.

[Kalyani Jangam1]

Hi @Akhila Vangala 

Yes, got the solution

UI Page -mim_workbench_promote

Modify promote function in client script of Ui page like below

function promote() {
if (service.value == '' || service.value == null) { // check service value empty or not
alert("Please fill service value");
return false;
} else {
getMessage("Promoted to a major incident", function(msg) {
var updateWorkNotes = msg + "\n" + workNotes.value.trim();
if (!promoteBtn.hasClassName('disabled')) {
if (window.NOW.MAJOR_INCIDENT_WORKBENCH) {
var record = {};
record.work_notes = updateWorkNotes;
record.business_impact = businessImpact.value;
record.service = service.value;
_promoteRestCall(record).then(function() {
dialog.setPreference('reload', true);
close();
});
} else {
//When UI Page is rendered from Form UI Action
if (config.workspace) {
iframeMsgHelper.confirm({
msg: msg,
workNotes: workNotes.value.trim(),
businessImpact: businessImpact.value.trim()
});
} else {
g_form.getControl('work_notes').value = updateWorkNotes;
g_form.setValue('business_impact', businessImpact.value);
g_form.setValue('business_service', service.value);
GlideModal.prototype.get('sn_major_inc_mgmt_mim_workbench_promote').destroy();
gsftSubmit(null, g_form.getFormElement(), 'sysverb_mim_accept');
}
}
}
});
}
}

Please try, it will help.
Please Mark Helpful and Correct if it really help you.

[Akhila Vangala]

This is great Kalyani, Appears simple. But always simple is difficult. Coding in such few lines is good.

I have done it in another way, Displayed the Mandatory Star and until Worknotes and Service doesn;t have a value, Promote button will not be enabled.

This is what I have done.

UI Page- mim_workbench_promote

HTML

Added a new style called 'service-wrapper' and called this for our Service, there by Mandatory * showed up in Red Colour

<style>
#work-notes-wrapper .required-marker {
      display: inline-block;
      }
	   #service-wrapper .required-marker {
      display: inline-block;
      }
   </style>

<div class="form-group" id="service-wrapper"> //called style service-wrapper in the whole div tag
            <label class="col-sm-2 control-label" for="mim-promote-service">
            <span mandatory="true" class="required-marker label_description"></span>
            ${gs.getMessage('Service')}</label>
            <div class="col-sm-10">
               <g:ui_reference name="mim-promote-service" id="mim-promote-service" table="cmdb_ci_service" completer="AJAXTableCompleter" oninput="promoteModal.workNotesOnChange()" onchange="promoteModal.workNotesOnChange()"/>
            </div>
         </div>

***********************************************************

Client Script:

var service = $("mim-promote-service"); //We added it earlier 
var workNotesWrapper = $('work-notes-wrapper');
var serviceWrapper = $('service-wrapper'); // Declared new variable and called Id which is declared in HTML

//Modified workNotesOnChange- Function, If Worknotes value and Service value is given as input or if it is changed only then PROMOTE button shows up else it will be in Disabled state.

 function workNotesOnChange() {
        workNotes.value.trim() ? workNotesWrapper.addClassName('is-filled') : workNotesWrapper.removeClassName('is-filled');
        service.value ? serviceWrapper.addClassName('is-filled') : serviceWrapper.removeClassName('is-filled');
        (workNotes.value.trim() && service.value) ?
        (promoteBtn.removeClassName('disabled'), promoteBtn.writeAttribute('aria-disabled', false)) :
        (promoteBtn.addClassName('disabled'), promoteBtn.writeAttribute('aria-disabled', true));
    }

[Akhila Vangala]

Hello @Kalyani 

The Service value which is already on the form is not being passed onto the UI Page. Business Impact which is already on the form, is passed onto the pop-up. The same should happen to Service as well, right? But it isn't happening at all. Kindly help.

I have created another link you can reply me over there if you can help!

How to pass a reference value from form to UI page