Skip to main content

Notifications

Announcements

No record found.

Customer experience | Sales, Customer Insights,...
Suggested answer

Javascript error in Model Driven App

Posted on by 5

Hello!

Please could someone take a look at the below and potentially reveal an answer? Any help would be much appreciated!

I am trying to implement JS to only show the tabs relevant to the business process flow stage.

However, the formContext.ui.tabs.get is returning null:

pastedimage1638706794256v1.png

I have double checked the name of the tabs and business process flow stage name, so I am unsure why it is returning as null.

Code is below.

function onLoadMatt(executionContext) {
  var formContext = executionContext.getFormContext();
  formContext.data.process.addOnStageChange(onStageChangeMatt);
}

function onStageChangeMatt(executionContext) {
  var formContext = executionContext.getFormContext();
  var stage = formContext.data.process.getSelectedStage();
  var stageName = stage.getName();
 
  formContext.ui.tabs.get("tab_Create").setVisible(false);
  formContext.ui.tabs.get("tab_PI").setVisible(false);
  formContext.ui.tabs.get("tab_QR").setVisible(false);
  formContext.ui.tabs.get("tab_PO").setVisible(false);

  switch(stageName) {
    case "Create": {
      formContext.ui.tabs.get("tab_Create").setVisible(true);
      formContext.ui.tabs.get("tab_Create").setFocus();
      if(formContext.getAttribute("createdon").getValue() != null) {
        var tabObj = formContext.ui.tabs.get("tab_Create");
        var sectionObj = tabObj.sections.get("tab_Create_section_3");
        sectionObj.setVisible(true);
      }
      break;
    }
    case "PI": {
      formContext.ui.tabs.get("tab_PI").setVisible(true);
      formContext.ui.tabs.get("tab_PI").setFocus();
      break;
    }
    case "QS": {
      formContext.ui.tabs.get("tab_QR").setVisible(true);
      formContext.ui.tabs.get("tab_QR").setFocus();
      break;
  }
    case "PO": {
      formContext.ui.tabs.get("tab_PO").setVisible(true);
      formContext.ui.tabs.get("tab_PO").setFocus();
      break;
}
    default: {
      formContext.ui.tabs.get("tab_Create").setVisible(true);
      formContext.ui.tabs.get("tab_Create").setFocus();
      break;
    }
  }
}

I am calling the functions on the form onLoad event stage and I have checked that the execution context is being passed as the first parameter, and that the web resources are correct.

pastedimage1638707002590v2.png

I am unsure what to change in the code to make this right?

Thanks

  • Suggested answer
    Bipin D365 Profile Picture
    Bipin D365 28,964 Super User 2024 Season 1 on at
    RE: Javascript error in Model Driven App

    Hi,

    I have used same  code on my instance and it is working as expected.

    See below result.

    CR9.PNG

    Make sure you are providing the correct tab name. You have mentioned Name field from Tab properties instead of Label.

    CR10.PNG

    If you multiple Events added on form then move this method to top to see if it resolve your issue.

    Good Luck!

    Please mark my answer verified if this is helpful!

    Regards,

    Bipin Kumar

    Follow my Blog: xrmdynamicscrm.wordpress.com/

  • Inogic Profile Picture
    Inogic 24,094 on at
    RE: Javascript error in Model Driven App

    Hi,

    One of the reasons behind the error is that the logical name of the tab ("tab_QR") could be incorrect. The reason is that you have mentioned it as “QS” in the switch case. I would suggest you to recheck the code with the tab’s logical name and use the debugger which will help you to find breakpoints. 

    Thanks!

  • Suggested answer
    Moh Helper Profile Picture
    Moh Helper 250 on at
    RE: Javascript error in Model Driven App

    Hi,

    I suppose that the problem is linked to the first line of the onStageChangeMatt method ("var formContext = executionContext.getFormContext();"). You are overwritting the formContext and so removing the correct formcontext set during the onloadMatt method.

    I will suggest you to create a global variable formContext (var formContext;)  and set it only in the onLoadMatt method. It will be available in all your other methods.

    Normally your problem will be resolved.

    Kr,

    M.Helper

  • Suggested answer
    NODAL Profile Picture
    NODAL 860 on at
    RE: Javascript error in Model Driven App

    Hi,

    Try using anonymous function and pass onload executionContext.

    Replace onload function with following.

    function onLoadMatt(executionContext) {

     var formContext = executionContext.getFormContext();

     formContext.data.process.addOnStageChange(function(e){onStageChangeMatt(executionContext)});

    }

  • ankit_singhal Profile Picture
    ankit_singhal 560 on at
    RE: Javascript error in Model Driven App

    Can you try to call one function at a time on Onload and check the error. I am using formContext.ui.tabs.get this also and working fine for me.

  • Suggested answer
    RE: Javascript error in Model Driven App

    Hi,

    We can use the below article to investigate on form issues in Model Driven Apps-

    Troubleshoot form issues in model-driven apps (model-driven apps) - Power Apps | Microsoft Docs

    Hope this helps!

    Regards,

    Venkatesh N

Under review

Thank you for your reply! To ensure a great experience for everyone, your content is awaiting approval by our Community Managers. Please check back later.

Helpful resources

Quick Links

December Spotlight Star - Muhammad Affan

Congratulations to a top community star!

Top 10 leaders for November!

Congratulations to our November super stars!

Tips for Writing Effective Suggested Answers

Best practices for providing successful forum answers ✍️

Leaderboard

#1
André Arnaud de Calavon Profile Picture

André Arnaud de Cal... 291,280 Super User 2024 Season 2

#2
Martin Dráb Profile Picture

Martin Dráb 230,214 Most Valuable Professional

#3
nmaenpaa Profile Picture

nmaenpaa 101,156

Leaderboard

Featured topics

Product updates

Dynamics 365 release plans