)
We use cookies to give you the best experience on our website. If you continue to browse, then you agree to our privacy policy and cookie policy. (Last updated on: June 24, 2019).
Unfortunately, activation email could not send to your email. Please try again.
Syncfusion Feedback

How to handle multiple models in a single view with MVC razor?

Platform: ASP.NET MVC |
Control: General |
Published Date: May 23, 2015 |
Last Revised Date: May 8, 2019
Tags: general, listview

Handling multiple models in a single view

You can use multiple models in a single view by creating a common model for all the models that are to be used in a single view. To achieve this, refer to the following steps.

 

First, create a new model (common for all models) and refer all other models that are to be used in the same view. Refer to the following code example.

ViewModel.cs

    public class ViewModel
    { 
        public IEnumerable<ListTemplate> ListModel1 = ListTemplateModel.setListTempSource();
        public IEnumerable<ListViewSample> ListModel2 = ListViewSampleModel.setViewTempSource();
    }

 

Next, create controller and pass the common model to it. Refer to the following code example.

ListViewController.cs

        public ActionResult Index()
        {
            ListTemplateModel.clearSource();
            ListViewSampleModel.clearSource();
            ViewModel mymodel = new ViewModel();
            return View(mymodel);
        }

 

In View page, refer only to the common model file. Then, you can differentiate the models by using the variables that are created in the common model file.

For example, for first model you can refer to the model as model.ListModel1. Refer to the following code example.

Index.cshtml

@model Sample.Models.ViewModel
    @{
        @Html.EJ().ListView("list1").RenderTemplate(true).Width(700).DataSource(Model.ListModel1).ContentTemplate(@<div class="cont-bg">
            <div class="{{>className}}">
            </div>
            <div class="listrightdiv">
                <span class="templatetext">{{>name}}</span> <span class="designationstyle">{{>designation}}</span>
                <div class="aboutstyle">
                    {{>about}}
                </div>
            </div>
        </div>);
    }
    <br />
    <br />
    @{
        @Html.EJ().ListView("list2").RenderTemplate(true).Width(700).DataSource(Model.ListModel2).ContentTemplate(@<div class="cont-bg">
            <div class="{{>className}}">
            </div>
            <div class="listrightdiv">
                <span class="templatetext">{{>name}}</span> <span class="designationstyle">{{>designation}}</span>
                <div class="aboutstyle">
                    {{>about}}
                </div>
            </div>
        </div>);
    }

Likewise you can differentiate the models in a single view.

 

The following screenshot illustrates the output.

Multiple models in a single view

Figure 1: Multiple models in a single view

2X faster development

The ultimate ASP.NET MVC UI toolkit to boost your development speed.
ADD COMMENT
You must log in to leave a comment

Please sign in to access our KB

This page will automatically be redirected to the sign-in page in 10 seconds.

Up arrow icon

Warning Icon You are using an outdated version of Internet Explorer that may not display all features of this and other websites. Upgrade to Internet Explorer 8 or newer for a better experience.Close Icon

Live Chat Icon For mobile
Live Chat Icon