Unveiling the Magic of JavaScript in Dynamics 365 CRM: Your Beginner’s Guide – 2


Greetings, fellow adventurers of the Dynamics 365 CRM realm! If you’ve just arrived, fear not, for you are about to embark on the second part of our epic journey into the enchanting world of JavaScript sorcery within Microsoft Dynamics 365 CRM.

In Part 1, we laid the foundation, introducing you to the essence of JavaScript, the magical realm of form event programming, and the secret art of web resources. Now, as the curtains rise for Part 2, we delve deeper into the enchanted code, explore a real-world customer requirement, and unravel the spellbook of knowledge that will empower you to wield the magic of JavaScript in CRM.

So, fasten your seatbelts, grab your wizard’s hat, and let’s dive headfirst into the mystical realms of Microsoft Dynamics 365 CRM development. The adventure continues, and the magic awaits your command! Welcome back to the saga of JavaScript in Dynamics 365 CRM. Let the coding magic unfold! ✨🚀

Chapter 7: A Journey Through the Enchanted Code – Sample Customer Requirement

To truly understand the art of JavaScript in Microsoft Dynamics 365 CRM, let’s embark on a quest to fulfill a sample customer requirement. Our brave adventurer, a Dynamics CRM user, desires a custom form that dynamically hides and shows fields based on certain conditions.

Sample Customer Requirement:

Requirement: When a CRM record is in the “In Progress” stage, hide the “Estimated Completion Date” field. Once the stage changes to “Completed,” reveal the hidden field.

The Enchanting Code:

// JavaScript to Handle Field Visibility Based on Stage

function handleFieldVisibility() {
  // Get the current stage
  var currentStage = Xrm.Page.data.process.getActiveStage().getName();

  // Get the field to be manipulated
  var estimatedCompletionDateField = Xrm.Page.getAttribute("estimatedcompletiondate");

  // Check the current stage and perform magic
  if (currentStage === "In Progress") {
    // Hide the field
    estimatedCompletionDateField.controls.forEach(function (control) {
  } else if (currentStage === "Completed") {
    // Show the field
    estimatedCompletionDateField.controls.forEach(function (control) {

// Attach the function to the onChange event of the stage field

// Trigger the function on form load

In this enchanted script, the handleFieldVisibility function is summoned to perform the magic. It fetches the current stage and dynamically hides or shows the “Estimated Completion Date” field based on the stage. The addOnChange event listener ensures that the magic is triggered when the stage field changes, and a sneak peek into the future is granted on form load.

Chapter 8: A Spellbook of Knowledge – JavaScript in CRM Explained

To unravel the mysteries of JavaScript in Microsoft Dynamics 365 CRM, let’s delve into the essential concepts and commands that form the spellbook of every CRM wizard.


  1. Context:
    • Xrm.Page.context.getUserRoles(): Retrieve user roles.
  2. Data:
    • Xrm.Page.data.entity.save(): Save the current record.
  3. UI:
    • Xrm.Page.ui.tabs.get("tabname").setVisible(true): Show a specific tab.


  1. Entity:
    • Xrm.Page.data.entity.getPrimaryAttributeValue(): Retrieve primary attribute value.
  2. Process:
    • Xrm.Page.data.process.getActiveProcess(): Get the active process.
  3. Navigation:
    • Xrm.Page.ui.navigation.items.get("navitem").setVisible(true): Show a navigation item.


  1. Attributes:
    • Xrm.Page.data.entity.attributes.forEach(): Iterate through entity attributes.
  2. Controls:
    • Xrm.Page.ui.controls.get("fieldname").setVisible(true): Show a specific control.
  3. Items:
    • Xrm.Page.ui.formSelector.items.forEach(): Iterate through form selector items.
  4. Tabs:
    • Xrm.Page.ui.tabs.get("tabname").setVisible(true): Show a specific tab.
  5. Sections:
    • Xrm.Page.ui.tabs.get("tabname").sections.get("sectionname").setVisible(true): Show a specific section.

Chapter 9: The Grand Finale – A Showcase of Events

Supported Events:

  1. onLoad:
    • Xrm.Page.data.entity.addOnLoad(functionName): Attach a function to the form load event.
  2. onSave:
    • Xrm.Page.data.entity.addOnSave(functionName): Attach a function to the record save event.
  3. onChange:
    • Xrm.Page.getAttribute("fieldname").addOnChange(functionName): Attach a function to the field change event.
  4. TabStateChange:
    • Xrm.Page.ui.tabs.get("tabname").addOnTabStateChange(functionName): Attach a function to the tab state change event.
  5. OnReadyStateComplete:
    • Xrm.Page.data.addOnReadyStateChange(functionName): Attach a function to the form ready state change event.
  6. PreSearch:
    • Xrm.Page.getControl("lookupfield").addPreSearch(functionName): Attach a function to the pre-search event of a lookup field.
  7. Business Process Flow Control Events:
    • Xrm.Page.data.process.addOnStageChange(functionName): Attach a function to the stage change event.

Chapter 10: A Call to Adventure – Embrace the Magic of JavaScript in CRM

As we conclude this epic journey through the enchanting realms of JavaScript in Microsoft Dynamics 365 CRM, remember that the true magic lies in your creativity and exploration. The spellbook is in your hands, and the possibilities are endless.

Embrace the magic, write your own scripts, and let the dance of JavaScript elevate your Dynamics CRM experience. The adventure continues, and the magic awaits those who dare to dream and code in the mystical world of Dynamics 365 CRM development.

May your code be elegant, your forms be enchanting, and your CRM adventures be filled with the everlasting magic of JavaScript! The saga continues, and the journey is yours to shape.

Leave a Reply