Bind display multiple tables on a view in MVC

Hi,

In this below example i was fetching the data from DB using Entity framework and display it on the view

Below is my entity class

public class Magazines
{
public string Name { set; get; }
public string PublishedDate { set; get; }
}

Create your Model First :

namespace EFMVCApp.Models
{

public class DashBoardViewModel
{
public List<Magazines> MagazinesList1 { set; get; }
public List<Magazines> MagazinesList2 { set; get; }
public List<Magazines> MagazinesList3 { set; get; }
public List<Magazines> MagazinesList4 { set; get; }
}
}

Create your controller next :

public class EFSampleController : Controller
{
public ActionResult Index()
{
List<Magazines> MagazinesList1 = GetMaganizes1();
List<Magazines> MagazinesList2 = GetMaganizes2();
List<Magazines> MagazinesList3 = GetMaganizes3();
DashBoardViewModel model = new DashBoardViewModel();
model.MagazinesList1 = MagazinesList1;
model.MagazinesList2 = MagazinesList2;
model.MagazinesList3 = MagazinesList3;
return View(“dashboard”,model);
}
}

Create your Views with name (dashboard) in EFSample folder inside the views folder:

@model EFMVCApp.Models.DashBoardViewModel
@{
ViewBag.Title = “Index”;
}
<h2>
Dashboard</h2>

@Html.Partial(“_Maganize1”, Model.MagazinesList1)
@Html.Partial(“_Maganize2”, Model.MagazinesList2)
@Html.Partial(“_Maganize3”, Model.MagazinesList3)

Now create the partial views inside the same folder

On Maganize1 Partial View (_Maganize1)

@model List<EFAccess.Magazines>
<table id=”tblDemo”>
<thead>
<tr>
<th>
Name
</th>
<th>
Published Date
</th>

</tr>
</thead>
<tbody>
@foreach (var obj in Model)
{
<tr>
<td>
@obj.Name
</td>
<td>
@obj.PublishedDate
</td>

</tr>
}
</tbody>
</table>

On Maganize2 Partial View(_Maganize2)

@model List<EFAccess.Magazines>
<table id=”tblDemo”>
<thead>
<tr>
<th>
Name
</th>
<th>
Published Date
</th>

</tr>
</thead>
<tbody>
@foreach (var obj in Model)
{
<tr>
<td>
@obj.Name
</td>
<td>
@obj.PublishedDate
</td>

</tr>
}
</tbody>
</table>

On Maganize3 Partial View(_Maganize3)

@model List<EFAccess.Magazines>
<table id=”tblDemo”>
<thead>
<tr>
<th>
Name
</th>
<th>
Published Date
</th>

</tr>
</thead>
<tbody>
@foreach (var obj in Model)
{
<tr>
<td>
@obj.Name
</td>
<td>
@obj.PublishedDate
</td>

</tr>
}
</tbody>
</table>

Advertisements

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s