Создание сетки с осью 2

Question

Я пытаюсь создать сетку, содержащую события по оси x и требования к оси y и заполнен решениями.

 Event1  Event2 
Req1 Sol1 
Req2     Sol2 

В моей модели содержится список событий, в котором содержатся связанные с ними Требования, которые содержат связанные с ними решения. Каждое событие может иметь 0 или более требований, и каждое Требование может иметь 0 или более решений.

Как я могу точно показать эту сетку в бритве?

Вот моя попытка:

<table border="1"> 
    <tr> 
     <td class="span-6"></td> 
     @foreach(var events in Model.Events) 
     { 
     <td colspan="3"> 
      @events.Name 
     </td> 
      requirementsList.AddRange(events.Requirements); 
     } 
    </tr> 
    @foreach(var req in requirementsList) 
    { 
     <tr> 
      <td> 
       @req.Name 
      </td> 
      <!--Insert logic to align solution with Event--> 
      <td> 
       @req.Solution 
      </td> 
     </tr> 
    } 
</table> 

Конечно, это только показывает все решения в первой колонке событий.

Answer 1

Я сделал подобную вещь в PHP для моей системы расписания, я хочу отработанные для каждого сотрудника на каждый день (от 2 даты):

 | 1 May | 2 May | ... May 
Fred | 6  | 
George |  | 4 | 

я использовал 3 Foreach петли, первый я выводимый даты, я ухаживал за каждым сотрудником, а внутри цикла сотрудника я снова зацикливал даты.

Так что для вас это будет:

<table border="1"> 
    <tr> 
     <td class="span-6"></td> 
     @foreach(var events in Model.Events) 
     { 
     <td colspan="3"> 
      @events.Name 
     </td> 
      requirementsList.AddRange(events.Requirements); 
     } 
    </tr> 
    @foreach(var req in requirementsList) 
    { 
     <tr> 
      <td> 
       @req.Name 
      </td> 
      @foreach(var events in Model.Events) 
      { 
       @curRec = events.Requirements 
       @if (curRec.HasSolution) // If has a solution. 
       // Very important so solutions can be aligned properly 
       { // Output the solution 
      <td> 
       @curRec.Solution 
      </td> 
       } else { // Output a empty cell 
        <td></td> 
       } 
      } 
     </tr> 
    } 
</table>