Introduction

Sometimes we need to hide or show some fields on the form according to a field value or a condition. We can do it using business rule. but when we want to hide or show large number of fields, tabs, and sections on the form then it will become difficult. In such situation we can directly change form itself where we can add required fields, section, and tab. In this blog, I have explained how to change main form of the entity conditionally using JavaScript.

Solution

Here we are going to use JavaScript web resource. As an example we took project entity, where project and project template belong to same project entity and we can differentiate between them using “IsTemplate” field. we are going change main form of project and project template using this field.

Step by Step

1. Add JavaScript web resource.
2. Register function on onLoad event of the project form and pass execution context.
3. In JavaScript function, get form Context from executionContext

4. var oFormContext = executionContext.getFormContext();

4. Get the value of “msdyn_istemplate” field.

5.  var isTemplate = oFormContext.getAttribute("msdyn_istemplate").getValue();

5. If the record is a project template, then value of this field will be “true”. It means we will change form to form created for Project Template record if the value is true and if the value is false, then we will change form to form created for Project record.
6. Create a string variable and assign form label value to it according to IsTemplate field.

7.  var Form_Label;
    if (isTemplate == true) {
         Form_Label = "Project Template";
    } else {
         Form_Label = "Project";
    }

7. Both forms should be of main type and active.
8. Now, check the current form is the same form that we want to show, if it is not, then only we will change it.
9. Get all form objects available in formSelector.
10. Get the label of each form available and compare with the form label that we want to show.
11. If it is same, then navigate to that form object.
12. Final function will be as following:

    function fnChangeForm(executionContext) {
            "use strict";
            var oFormContext = executionContext.getFormContext();
            if (oFormContext != null) {
                var isTemplate = oFormContext.getAttribute("msdyn_istemplate").getValue();
                if (isTemplate != null) {
                       var Form_Label;
                       if (isTemplate == true) {
                             Form_Label = "Project Template";
                       } else {
                             Form_Label = "Project";
                       }
    
                      if (oFormContext.ui.formSelector.getCurrentItem().getLabel() != Form_Label ) {
                           var forms = oFormContext.ui.formSelector.items.get();
                           for (var i in forms) {
                                var form = forms[i];
                                var formLabel = form.getLabel()
                                if (formLabel == Form_Label ) {
                                      form.navigate();
                                }
                           }
                      }
                 }
            }
        }