You can render the generated MVC user interface for one MDriven ViewModel in your own ASP.NET MVC application without using the complete MDriven Turnkey application; this is for developers who want to host a model-driven view inside their own MVC controller and layout.
What this approach provides
A ViewModel is the model-defined presentation and interaction layer that exposes the data, actions, and layout for a use case. In MVC rendering, the runtime representation of that ViewModel is a VMClass.
Your MVC view receives a VMClass, then renders the Razor partial generated for that ViewModel. For example, a controller can create the SampleViewModel ViewModel and return a view that hosts its generated UI.
This approach is useful when you want to:
- Add a specific model-driven screen to an existing MVC site.
- Use your own controller, routes, layout, and surrounding HTML.
- Render the generated controls and actions for a ViewModel while keeping the rest of the site under your control.
For the full generated MVC UI template, including form submission, navigation helpers, and client-side action handling, use Documentation:MVC Generated ViewModel UI in MDrivenFramework.
How rendering works
The MVC renderer locates the generated Razor partial for the current VMClass. Call Html.RazorPartialFile() to obtain that partial's path and pass it to Html.Partial:
@Html.Partial(Html.RazorPartialFile())
The partial renders the user interface declared by the ViewModel. The host Razor view must therefore use VMClass as its model type.
Render a ViewModel in your MVC application
1. Create the ViewModel
In MDriven Designer, create the ViewModel that you want to render. This example uses a ViewModel named SampleViewModel.
The ViewModel defines what MVC renders. Add the columns, actions, and grids needed for the task. For example, a customer-editing ViewModel might expose customer name and email fields, an Update action, and a grid of related orders.
2. Create a controller
Create an MVC controller that derives from ModelDrivenControllerBase<TEcoSpace>, where TEcoSpace is your EcoSpace type. ModelDrivenControllerBase supplies ViewModel, action, and navigation support for MVC.
using System.Web.Mvc;
using Eco.ViewModel.Runtime;
public class MyController : ModelDrivenControllerBase<EcoProject1EcoSpace>
{
public MyController() : base()
{
RenderSettings.UseCSSGridByDefault = true;
}
public ActionResult TestStart2()
{
var vmc = ViewModelHelper.CreateFromViewModel(
"SampleViewModel",
this.EcoSpace,
null,
false);
return View("GenericView", vmc);
}
}
ViewModelHelper.CreateFromViewModel creates the runtime VMClass instance from the named ViewModel and the controller's EcoSpace. The string SampleViewModel must match an existing ViewModel name.
3. Create the host Razor view
Create a Razor view, for example Views/My/GenericView.cshtml. Declare the model as VMClass and insert the generated partial.
@using Eco.ViewModel.Runtime
@using Eco.MVC
@model VMClass
@{
ViewBag.Title = Model.ViewModelClass.Name;
}
<div id="contentWrapper" class="@Model.ViewModelClass.Name mvc-rendered">
<div id="viewmodelWrapper">
@Html.Partial(Html.RazorPartialFile())
</div>
</div>
Use the complete GenericView.cshtml template from Documentation:MVC Generated ViewModel UI in MDrivenFramework when the view must submit changes and execute model-driven actions. That template includes the form, hidden ViewModel identity fields, validation output, and supporting JavaScript expected by generated MVC UI.
4. Add a route into your site
Add a link to the controller action from your MVC layout or another Razor view.
@Html.ActionLink("Test2", "TestStart2", "My")
Selecting Test2 requests MyController.TestStart2, creates SampleViewModel, and renders its generated partial inside GenericView.cshtml.
Add standard MVC host elements
The host view can provide common MVC elements around the generated partial.
| Requirement | Host-view helper | Purpose |
|---|---|---|
| Generated ViewModel UI | @Html.Partial(Html.RazorPartialFile())
|
Renders the Razor partial generated for the current ViewModel. |
| Left-side actions | @Html.DisplayLeftSection()
|
Renders actions intended for the left section of the MVC UI. |
| Constraint validation messages | @Html.ValidationSummary(true)
|
Displays validation messages, including broken ViewModel constraints. |
For example, place validation output after the generated content:
<div id="validationMessageWrapper">
@Html.ValidationSummary(true)
</div>
Use Documentation:MVC View Model constraints to understand how ViewModel constraints participate in MVC validation.
Handle posts and ViewModel identity
Generated MVC UI can post data back to the server. The complete generated template includes hidden fields that identify both the root object and the ViewModel name during postback:
@Html.Hidden(VMClass.ThisAsExternalId_nameOf)
@Html.Hidden(
VMClassBinder.ViewModelNameFormAttribute,
Model.ViewModelClass.ViewModel.RootViewModelClass.Name)
These fields are required when the ViewModel must be recreated on postback. For MVC binding setup and stateless roundtrips, see Documentation:MVC.
If the ViewModel contains file upload controls, the form must use multipart/form-data encoding. The complete form pattern is documented in Documentation:MVC Generated ViewModel UI in MDrivenFramework.
The rendered content can move to another view when the ViewModel contains navigation buttons. A grid row can also drive interaction through actions defined on that grid.
MVC grid behavior differs from Angular rendering:
- If a grid row has one action, MVC executes that action when the user clicks the row.
- If a grid row has zero or multiple actions, MVC selects the row.
- MVC does not show the popup menu of multiple row actions used by Angular.
See Documentation:MVC for the MVC rendering model and Documentation:Bindings for angular for the separate Angular binding topic.
What you implement outside Turnkey
Rendering a single ViewModel this way does not provide the complete MDriven Turnkey application experience. If your application needs a model-driven main menu, modal windows, asynchronous loading, preservation of unsaved state, or action-choice handling, implement those behaviors in your MVC application or use MDriven Turnkey.
If you intend to build your own renderer rather than render the generated MVC partial, use the runtime metadata described in Documentation:Rendering the MDriven Turnkey application yourself.