Div Tabellen mit ASP.NET MVC

Question

Ich versuche, einen besseren Weg zu finden, eine div Tabelle mit ASP.NET MVC zu verwenden, das Problem, das ich sehe, ist, dass Sie brauchen viel zu tun Looping, anstatt eine Schleife, wenn ich musste einen traditionellen <table> Tisch verwenden.

Beispiel

<div class="column"> 
    <div class="row">Name</div> 
    <% foreach (Person person in (List<Person>)ViewData.Model) {%> 
     <div class="row"><%= Html.Encode(person.Name) %></div> 
    <%} %> 
    </div> 
<div class="column"> 
    <div class="row">Email</div> 
    <% foreach (Person person in (List<Person>)ViewData.Model) {%> 
     <div class="row"><%= Html.Encode(person.Email) %></div> 
    <%} %> 
    </div> 
<div class="column"> 
    <div class="row">Phone</div> 
    <% foreach (Person person in (List<Person>)ViewData.Model) {%> 
     <div class="row"><%= Html.Encode(person.Phone) %></div> 
    <%} %> 
    </div> 

Answer 1

Wenn es wie eine Tabelle aussieht und riecht wie ein Tisch, warum nicht eine Tabelle verwenden?

Aber wenn Sie es auf diese Weise tun möchten, versuchen Sie, eine Erweiterung Methode für Ihre HTML-Eigenschaft zu erstellen, die diesen HTML-Code generiert und die Liste als Parameter und möglicherweise eine Liste für Ihre Spalten, um Ihren HTML-Code zu generieren Sie können die TagBuilder-Klasse verwenden.

Answer 2

Es ist ziemlich subjektive Frage, aber ich denke, Sie nicht wirklich so tun müssen, divs verwenden, Coz Sie einfach Tabelle von Daten angezeigt wird, und das ist, warum wir „Tisch“ müssen Etikett.

Die Einführung von div und CSS-Layout ist nicht die Tabelle Tag zu ersetzen, sondern um freie Tabelle Tag von Formatierung und Layout Job.

bearbeiten

Darüber hinaus können Sie nach wie vor in einer Schleife Ihre Arbeit tun. Anstatt Schleife durch Spalten, warum nicht eine Schleife durch Zeilen (Name, Telefon ...)

<% foreach(Person person in (List<Person>)ViewData.Model)) %> 
<div class="row"> 
    Name: <%= Html.Encode(person.Name) %> 
    Email: <%= Html.Encode(person.Email) %> 
    ... 
</div> 

Obwohl ich persönlich noch Tabelle lieber mit (zusammen mit tr und td) statt.

Answer 3

Wenn Sie tabellarische Daten sind dislaying, das ist, warum es die Tabelle Tag ist. Leute schlagen nur div vor, statt Tisch, wenn es um Layout geht. Es ist also vollkommen in Ordnung, das Tabellen-Tag zu verwenden, wenn Sie Informationen vom Schlüssel-Wert-Typ anzeigen.

Answer 4

Ich stimme mit dem, was alle anderen gesagt haben (die Sie wirklich nur einen Tisch verwenden sollte) - aber ich werde versuchen, auch mit einer Lösung für Ihr Problem zu finden.

Das glaube ich nicht, dass es eine elegante Weise, die „Schleife mehr als einmal“ Problem zu überwinden, aber zumindest können wir es ein wenig „leichter“ machen, um neue Spalten zur Liste hinzufügen:

var myList = (List<Person>)ViewData.Model; 
var myColumns = new Dictionary<string, List<string>>(); 

myColumns.Add("Name", new List<string>()); 
myColumns.Add("Email", new List<string>()); 
myColumns.Add("Phone", new List<string>()); 
foreach(var person in myList){ 
    myColumns["Name"].Add(Html.Encode(person.Name)); 
    myColumns["Email"].Add(Html.Encode(person.Email)); 
    myColumns["Phone"].Add(Html.Encode(person.Phone)); 
} 

jetzt Dann können Sie dies tun:

<% foreach(var column in myColumns){ %> 
<div class="column"> 
    <div class="row"><%= column.Key %></div> 
    <% foreach (string value in column.Value) {%> 
     <div class="row"><%= value %></div> 
    <%} %> 
    </div> 
<% } %> 

Es ist immer noch eine schlechte Leistung ist im Vergleich zu den -tag und ich sehe nicht, warum Sie wollen würde vermeiden, dass in diesem Szenario wirklich.