Dynamics CRM 2013 Javascript Upgrade

Question

We are testing the upgrade of our Dynamics CRM from 2013 to 2016 to understand what customization needs to be upgraded after the CRM upgrade.

We have the following Javascript webresource that we are using for a particular case.

function MyOnLoad()
{
   var pickListValue = Xrm.Page.getAttribute("field1").getValue();
   if (Xrm.Page.ui.getFormType() == 2 && pickListValue == 100000006)
   {
      var ddlNewField1 = document.getElementById("field1");
      if (ddlNewField1.addEventListener) { 
         ddlNewField1.addEventListener ("change", function () {MyOnChange();}, false);  
      }
      else {
         ddlNewField1.attachEvent('onchange',MyOnChange);
      }
   }
}

function MyOnChange()
{
   if (Xrm.Page.getAttribute("field1").getValue() == "100000006") {    
       Xrm.Page.getControl("field2").setVisible(false);     
       Xrm.Page.getAttribute("field2").setRequiredLevel("none");    
   }

// If the selected value is not Other, hide Specify, and set requirement to Not Required    
   else {    
        Xrm.Page.getControl("field2").setVisible(true);  
        Xrm.Page.getAttribute("field2").setRequiredLevel("required");
   }
}

This code is working fine in our Dynamics CRM 2013 and it is intended to do the following:

When the Lead form loads, if the value of FIELD1 is set to a specific value, it shows the second field FIELD2 and makes it business required.

The tricky part here is that the second field is visible ONLY if the first field contains that specific value when the form loads. If for some reason the value of the first field during the form load is different, the second field will not show even if you choose that specific value.

So to resume:

• On Form Load never show FIELD2

• If On Form Load FIELD1 value equals X AND FIELD1 value changes -> SHOW FIELD2 and make it required

• If On Form Load FIELD1 value does not equal X and FIELD1 value changes -> Never show FIELD2 even if the choice of FIELD1 becomes X because it wasn't initially X

I tried to explain myself so I hope I was clear on what this actual javascript does.

The problem where are having after the upgrade is related to the "addEventListener":

TypeError: Cannot read property 'addEventListener' of null at MyOnLoad

I wanted to ask if someone can help us upgrade this Javascript or if there might be a business rule that can replace this. I actually tried setting up business rules but couldn't separate in the business rule the conditions of load and change.

Thanks

Answer 1

Do not access the DOM as you are doing when you use document.getElementById . In the words of Microsoft :

JavaScript developers are used to interacting with Document Object Model (DOM) elements in code. You might use the window.getElementById method or the jQuery library. You are free to use these techniques in your HTML web resources, but they are not supported to access elements in Microsoft Dynamics 365 application pages or entity forms. Instead, access to entity form elements are exposed through the Xrm.Page object model. The Microsoft Dynamics 365 development team reserves the right to change how pages are composed, including the ID values for elements, so using the Xrm.Page object model protects your code from changes in how pages are implemented.

In your case, you can instead use the supported addOnChange :

Xrm.Page.getAttribute("field1").addOnChange(MyOnChange)