Dynamics 365 - Dynamically Add / Remove Values from a Multi-select Picklist

Following code can be used to dynamically remove a particular value from a multi-select option set:

function RemoveValuefromMultiSelectOptionSet(executionContext, valueInteger)

{

var formContext = executionContext.getFormContext();

formContext.ui.controls.getByName("new_multiselectpicklist1").removeOption(parseInt(valueInteger,10));

}

Similarly, in case a value needs to be added dynamically (or be brought back according to context), following code can be used: 

function AddValuefromMultiSelectOptionSet(executionContext, valueText, valueInteger)

{

var formContext = executionContext.getFormContext();

var newObj = { "text" : valueText, "value" : parseInt(valueInteger,10)};

formContext.ui.controls.getByName("new_picklist1").addOption(newObj);

}

Dynamics 365 - How to Get Selected Count of Multi-Select Picklist

Lets take an example of a multi-select picklist having 5 values: 

1. Banana
2. Orange
3. Strawberry
4. Guava 
5. Grapes

While working on the form, if a user selects only 2 out of these, e.g: 

1. Banana
2. Guava

Following JavaScript will return the count of selected values in the multi-select picklist i.e. 2. 

function GetMultiSelectPicklistLength(executionContext)

{

var length = 0;

var formContext = executionContext.getFormContext();

var multiSelectField = formContext.getAttribute("new_MultiselectPicklist");

if(multiSelectField != null)

{

var fieldValue = multiSelectField.getText();

if(fieldValue != null)

{

lengthValue = fieldValue.length;

}

}

return length;

}

Dynamics 365 - How to add JavaScript event handlers to Business Process Flow

Dynamics 365 provides option of adding JavaScript on following Business Process Flow events:

• OnPreProcessStatusChange
• OnProcessStatusChange
• OnStageChange
• OnStageSelected

Event handlers available for each of these events are:

Source: https://docs.microsoft.com/en-us/powerapps/developer/model-driven-apps/clientapi/reference/formcontext-data-process

Example: 

Following example will show how to show / hide form tabs on change of business process flow stage in 3 simple steps.

Step1: 

On form load event, add the event handler JavaScript: 

function onLoad(executionContext)

{

var formContext = executionContext.getFormContext();

var activeStageName = "";

var activeProcess = formContext.data.process;

if(activeProcess != null)

{

formContext.data.process.addOnStageChange(ShowHideRelevantTabs);

}

}

Step2: 

Add the ShowHideRelevantTabs function in JavaScript:

function ShowHideRelevantTabs(executionContext)

{

var formContext = executionContext.getFormContext();

var activeStageName = GetProcessStage(formContext);

switch(activeStageName)

{

case "Stage1":

formContext.ui.tabs.get("tab_1").setVisible(true);

formContext.ui.tabs.get("tab_2").setVisible(false);

formContext.ui.tabs.get("tab_3").setVisible(false);

formContext.ui.tabs.get("tab_1").setFocus(true);

break;

case "Stage2":

formContext.ui.tabs.get("tab_1").setVisible(true);

formContext.ui.tabs.get("tab_2").setVisible(true);

formContext.ui.tabs.get("tab_3").setVisible(false);

formContext.ui.tabs.get("tab_2").setFocus(true);

break;

case "Stage3":

formContext.ui.tabs.get("tab_1").setVisible(true);

formContext.ui.tabs.get("tab_2").setVisible(true);

formContext.ui.tabs.get("tab_3").setVisible(true);

formContext.ui.tabs.get("tab_3").setFocus(true);

break;

default:

formContext.ui.tabs.get("tab_1").setVisible(true);

formContext.ui.tabs.get("tab_2").setVisible(true);

formContext.ui.tabs.get("tab_3").setVisible(true);

}

}

Step3: 

Upload JavaScript on entity's Onload event. Section 2 and 3 in following article provide step by step approach on loading JavaScript in Dynamics 365 entities: 

https://docs.microsoft.com/en-us/powerapps/developer/model-driven-apps/clientapi/walkthrough-write-your-first-client-script 

Good Luck 👍