Hide UI Action buttons based on choice field

[prasad8]

Hi,

My requirement:

I have created choice field with choice1,choice2,choice3,choice4. i have a ui actions 1. manager approval, 2. justify

If i select choice1 or choice2 visible manger approval ui action or if select other options i need visible justify ui action

for this i have created one Onchange client script, Here the script:

function onChange(control, oldValue, newValue, isLoading, isTemplate) {
if (isLoading || newValue === '') {
return;
}
if (newValue == 'Enhancement') {
var items = $$('BUTTON').each(function(item) {
if (item.id.includes('manager_approval')) {
item.hide();
}
if (item.id.includes('state_demand_irrc_justification')) {
item.show();
}
});
}
if (newValue == 'Support') {

var items2 = $$('BUTTON').each(function(item) {
if (item.id.includes('manager_approval')) {
item.show();
}
if (item.id.includes('state_demand_irrc_justification')) {
item.hide();
}
});
}
}

please help on this

[Anil Lande]

Hi,

This is not correct way to handle UI Actions.

UI Action visibility is handles through the condition field on UI Action.

The visibility condition is evaluated when the record is loaded (onload). 

You can use condition for 'Manager Approval' like below:

current.u_choiceField=='Enhancemet' ||current.u_choiceField=='support' 

Thanks,
Anil Lande

[prasad8]

Hi @Anil Lande ,

I tried this for when ever i changed choice types is 1 or 2 i have to visible ui action button. 

Currently when we change the choice type after that we need to save the form then only it is displaying. 

i need this functionality in Onchange of the choice field

[Anurag Tripathi]

Hi,

Ideally, this should happen after the form is saved and not as one changes the drop down value.

Achieving that is also quite simple and you will not even need to do any DOM manipulation there.

Give it a thought.

-Anurag

[vkachineni]

Just as a DOM option. But prefer conditional visibility after saving.

//Also make sure isolate script is set to false for the client script. Untested.
function onChange(control, oldValue, newValue, isLoading, isTemplate) {
    if (isLoading || newValue === '') {
        return;
    }
    if (newValue == 'Enhancement') {
        var items = $$('BUTTON').each(function(item) {
			
			//get the sys_id of the UI action manager_approval & replace 5ac4febb7f222200c57212f44efa91f7
            if (item.id == '5ac4febb7f222200c57212f44efa91f7')) {
                item.hide();
            }
			//get the sys_id of the UI action state_demand_irrc_justification & replace 5ac4febb7f222200c57212f44efa91f7
            if (item.id == '5ac4febb7f222200c57212f44efa91f7') {
                item.show();
            }
        });
    }
    if (newValue == 'Support') {

        var items2 = $$('BUTTON').each(function(item) {
			//get the sys_id of the UI action manager_approval & replace 5ac4febb7f222200c57212f44efa91f7
            if (item.id == '5ac4febb7f222200c57212f44efa91f7') {
                item.show();
            }
			//get the sys_id of the UI action state_demand_irrc_justification & replace 5ac4febb7f222200c57212f44efa91f7
            if (item.id == '5ac4febb7f222200c57212f44efa91f7') {
                item.hide();
            }
        });
    }
}