CODEWITHSUNDEEP
asp.net-mvc-4html-table
SoftwareSavant
SoftwareSavant

Reputation: 9737

Making HTML Tables in MVC4 using Strongly typed models

I am attempting to make an HTML Table with data I pull out of DB...

Here is my Model...

public class PopulationModels
{
    public List<PopulationModel> Populations { set; get; }
}

Which is simply a list of...

public class PopulationModel
{
    public string populationID { set; get; }

    public string PopName { set; get; }

    public string Description { set; get; }

    public string PopulationType { set; get; }

    public Boolean isActive { set; get; }

    //public List<XSLTACOData> patients { set; get; }
}

I pass this model to my view like so...

IEnumerable<PopulationModels> PopModel = DataRepo.Get(userName);
return View(PopModel);

I attempt to show a list in the following way...

@foreach (var item in Model) {
<tr>
    <td class="rowControl hidden">
        @*<a href="#makeRowEditable" class="makeRowEditable">Edit</a>*@ |
        @*<a href="#deleteRow" class="deleteRow">Delete</a>*@
        @Html.DispalyFor(modelItem => item.Populations)
    </td>
</tr>
}

But I am having a hard time figuring out how to access the individual elements of my model...

For instance

@Html.DispalyFor(modelItem => item.Populations)

The above line of code, I want to take each individual populationModel and map a column for each of the fields... But I can't seem to access the individual populations... Am I missing a logical step here (I obviously am, but which step?)

UPDATE: ADDING SOME MORE OF THE VIEW: I am making now getting a table, but the way I am doing it seems counter intuitive...

Here is my model...

 @model IEnumerable<FocusedReadMissionsRedux.Models.PopulationModels>

Here is how I am creating my table (I am planning on using jqGrid's tableToGrid functionality as soon as I can get a solid way to access my data...

<table border="2">
<thead>
  <tr>
  <th>
    Population Name
  </th>
   <th>
    Population Description
  </th>
  </tr>
</thead>
@foreach(var item in Model){
foreach (var pop in item.Populations)
{
<tr>
    <td class="rowControl hidden">
        @Html.DisplayFor(modelItem => pop.PopName)
        @Html.ActionLink(pop.PopName,"","")
    </td>
    <td>
        @Html.DisplayFor(modelItem => pop.Description)
        @Html.Display(pop.Description)
    </td>
</tr>
}

}

Upvotes: 0

Views: 18068

Answers (2)

Jason Cidras
Jason Cidras

Reputation: 507

First.. A good naming convention is to rename your

PopulationModels

to

PopulationList

This is give other programmers coming in behind you insight of the purpose of the model.

Bring in your model:

@model Models.PopulationList

Then, we can loop through the model list with a foreach or for loop:

<table>
    <thead>
        <tr>
            <th>Population Name</th>
            <th>Population Description</th>
        </tr>
    </thead>
    <tbody>
    @foreach(Population pop in PopulationList)
    {
       <tr>
          <td>@Html.DisplayFor(model => pop.PopName)</td>
          <td>@Html.DisplayFor(model => pop.PopDesc)</td>
       </tr>
    }
    </tbody>
 </table>

You only need one foreach loop, because you are iterating a model in your list of the model.

I hope this helps for future references!

Upvotes: 0

Leon Cullens
Leon Cullens

Reputation: 12476

Since you didn't post the complete code for your view: you should define what kind of object you are binding to in your view like this:

@model IEnumerable<PopulationModels>

Then you can just loop through it with a foreach and bind to the current item using:

@Html.DisplayFor(x => x.Popname)

Upvotes: 1

Related Questions