CRM Crate

Trigger JavaScript during Tab change event in Dynamics 365

We will learn to trigger the JavaScript during Tab change event in Dynamics 365. Before we start, make sure to subscribe CRM Crate so that you stay up-to-date in field of Dynamics 365.

Trigger JavaScript during Tab change event in Dynamics 365

Why do we need to trigger JavaScript during form’s tab change?

You can use the tab change  event when you want to change the source “scr” property of an IFRAME within the tab. If you set the IFrame.src property in the OnLoad event for an IFRAME within a collapsed tab, the value will be overwritten when the tab is expanded.

Important note: – We can also trigger the JavaScript during Tab OnChange event using the form properties as shown below.

Using TabStateChange client API reference to add an event handler –

This event occurs when the DisplayState of the tab changes due to user interaction or when the setDisplayState method is applied in code.

tabObj.addTabStateChange(myFunction);

Adds a function to be called when the TabStateChange event occurs.

JavaScript snippet code for adding a tab change event –

The below JavaScript code is triggering during the OnLoad event of an entity form.

//CRM Crate - JavaScript Snippet
function CallMethod (executionContext) {
//Reading Attribute Value From The Form.
var formContext = executionContext.getFormContext();

//Obtaining Tab Object For Multiple Tabs.
var TabA = formContext.ui.tabs.get("Tab A"); //Enter The Tab Schema Name
var TabB = formContext.ui.tabs.get("Tab B"); //Enter The Tab Schema Name
var TabC = formContext.ui.tabs.get("Tab C"); //Enter The Tab Schema Name

//Using addTabStateChange Event Listner For Capturing Tab Change.
TabA.addTabStateChange(FunctionA);
TabB.addTabStateChange(FunctionB);
TabC.addTabStateChange(FunctionC);
}

//Functions To Perform Dedicated Operations.
function FunctionA() {
   alert("Tab State Changed - Tab A");
}
function FunctionB() {
   alert("Tab State Changed - Tab B");
}
function FunctionC() {
   alert("Tab State Changed - Tab C");
}

Validate the changes in Dynamics 365 form –

Once the above code has been deployed, navigate to the Dynamics 365 and validate if the Tab State Change event works as expected.

JavaScript function got triggered when user clicks “Tab A”.
JavaScript function got triggered when user clicks “Tab B”.
JavaScript function got triggered when user clicks “Tab C”.

Thus we learned to trigger JavaScript during Tab change event in Dynamics 365.

0 0 votes
Article Rating
Subscribe
Notify of
0 Comments
Inline Feedbacks
View all comments
error: CRM Crate Security Engine - Disabled Right Click & Selection!
0
Would love your thoughts, please comment.x
()
x

Congratulations!

Well Done,
Welcome to CRM Crate

Stay tuned with us and get all latest updates and learning in Microsoft CRM and related techonologes.