Embedding Canvas Apps into Model-Driven Forms for a Unified Experience

In Microsoft Power Apps, there are two main application types—canvas apps and model-driven apps—each serving unique purposes. While model-driven apps are tightly coupled with Microsoft Dataverse as their data source, canvas apps offer flexibility with 400+ data sources through built-in or custom connectors.

Canvas apps are highly customizable, allowing you to design user interfaces from scratch for mobile or tablet devices. You can drag and drop components, apply formulas for logic, and connect to multiple data sources. Model-driven apps, on the other hand, are structured, data-driven, and ideal for business process–focused solutions.

But what if you want the rich visuals and flexibility of a canvas app inside a structured model-driven form? That’s where embedding a canvas app comes in. This integration lets you enhance model-driven forms with custom visualizations, external data sources, and advanced interactivity.


Embedding via the Classic Experience

1. Open the main form in your model-driven app and switch to classic view.

2. Select the column that will bind to the canvas app.

3. In Field Properties, go to the Controls tab and select Add Control → Web.

4. Set the key properties:

  • Table (Entity) Name – Source data for the app.
  • App Name – Name of the existing canvas app.
  • App ID – Unique identifier of the canvas app.

5. If you don’t have an app yet, leave the fields blank and click Customize to create one in Canvas App Studio.

The app automatically includes a ModelDrivenFormIntegration control, bringing contextual form data directly into the embedded app.

 Embedding via the Modern Experience

1. Open the form editor in modern experience.

2. Select the column where the app will be embedded.

3. From the Related Data group, choose Canvas App.

4. In the Add Canvas App dialog, enter:

  • Entity Name
  •  App Name
  •   App ID

5. Publish your changes—the canvas app will now display inside the model-driven form.

The Power of ModelDrivenFormIntegration Control

Once embedded, the ModelDrivenFormIntegration control becomes the bridge between your host model-driven form and the canvas app. It enables:

  •  DataSource – Link the app’s data to the form’s table.
  •  OnDataRefresh – Trigger actions when the host form saves data.
  •  Item – Access fields from the host form.
  •  Actions like:
    • SaveForm
    • RefreshForm
    • NavigateToMainForm
    •  NavigateToView
    •  OpenQuickCreateForm

 Why Embed a Canvas App in a Model-Driven Form?

  • Enhanced UI – Bring in charts, maps, and visual dashboards.
  • Multiple Data Sources – Display data beyond Dataverse.
  • Custom Interactions – Add business-specific logic and workflows.
  • Improved Productivity – Give users a richer, single-screen experience.

By embedding a canvas app in a model-driven form, you combine the power of structured data management with the flexibility of custom design, creating a seamless and powerful user experience.

Comments

Post a Comment

Popular posts from this blog

Effective Strategies for Debugging Plugins in Dynamics CRM

Image
In a recent interview, I was asked about debugging plugins in Dynamics CRM. The interviewer specifically wanted to know my approach to plugin debugging. In response, I mentioned using the Plugin Registration Tool profiler. However, I later realized there are multiple methods to debug plugins in Dynamics CRM/Dataverse, each essential for efficient troubleshooting. Debugging plays a crucial role in development, and having a solid understanding of various debugging approaches can help streamline issue resolution in Dynamics 365. Here, I'll explore different techniques for debugging plugin code. There are below options to use in the plugin in Dynamics CRM/Dataverse ITracingService : In Dynamics CRM plugin development, ITracingService is a service provided within the plugin's execution context that logs information for tracing and debugging. It allows developers to capture real-time. Plugin Profiler : A plugin profiler in Dynamics CRM (or Dataverse) is a debugging tool in the Plugi...
Read more

Exploring the Differences: Managed vs. Unmanaged Solutions in Dynamics CRM/Dataverse

Image
In Dynamics CRM/Dataverse, solutions are central to Application Lifecycle Management (ALM) , providing a structured way to manage, package, and distribute customizations across environments. Microsoft uses solutions to transfer apps and customizations by exporting them from one Dataverse environment and importing them into another.  Each solution is authored and maintained by a publisher and includes components like Power Apps (canvas and model-driven), flows, entities, forms, connectors, web resources, and configurations—excluding business data. Solutions streamline ALM practices within Microsoft Power Platform. In Dynamics CRM/Dataverse, there are two types of solutions: Managed and Unmanaged . When planning an implementation, it’s important to understand the advantages and disadvantages of each to make an informed decision. Let’s explore both types to determine the best approach for development and deployment. In Dynamics 365 CRM, a managed solution is a fully packaged solution ...
Read more

Connecting the Dots: FetchXML and Web API Integration in Dataverse

Image
 In Dataverse, FetchXML and the Web API are two powerful mechanisms for retrieving data and interacting with entities. Here's a brief overview of each and how they can be integrated: 1.    FetchXML :      -   Definition:   FetchXML is a proprietary query language used in Microsoft Dynamics 365 and Dataverse for querying data from entities.    -   Usage:   FetchXML queries can be used to retrieve data based on complex criteria, perform aggregations, and filter records.    -   Features:   FetchXML supports various query expressions, including conditions, sorting, grouping, and aggregation functions.    -   Integration:   FetchXML queries can be executed programmatically using client-side scripting, server-side code, or through tools like the Dynamics 365 Web API. 2.    Web API :      -   Definition:  ...
Read more