Блог

Я работаю над проектом веб-приложения, используя Asp.Net Ядро MVC, где у меня есть представление, отображающее горизонтальную таблицу. Я использую частичный просмотр для достижения этой цели, но я застрял на том, как я могу представить фиксированные пять строк следующим образом:

1. День
2. Дата
3. Подходит
4. Неуместно
5. Отсутствие взаимодействия

каждая строка будет выводить значения динамически.

Вот мой взгляд, где он передает все, как ожидалось.

 <form method="get" asp-action="details">
    <table class="table order-list">
        <thead>

            @for (int i = 0; i < Model.SessionList.Count; i  )
            {
        <partial name="_ChartDetailsPartial" for="@Model.SessionList[i]"

                 />}

        </thead>
    </table>
    </form>
  

Вот мой PartialView, где я хочу отобразить и упорядочить все там.

 @model TestApplication.Models.ViewModels.SessionViewModel

@{
    ViewData["Title"] = "_ChartDetailsPartial";
}

<input type="hidden" asp-for="Id" />

<tr>
    <th>Day</th>
    @for (int i = 0; i < 16; i  )
    {
        <td>@Html.DisplayFor(m => m.Day)</td>
    }
</tr>
<tr>
    <th width="200">Date</th>
    @for (int i = 0; i < 16; i  )
    {
        <td>@Html.DisplayFor(m => m.Date)</td>
    }
</tr>
<tr>
    <th style="text-decoration: underline limegreen">Appropriate Data</th>
    @for (int i = 0; i < 16; i  )
    {
<td>@Html.DisplayFor(m => m.Appropriate)</td>
    }
</tr>
<tr>
    <th style="text-decoration: underline red">InAppropriate Data</th>
    @for (int i = 0; i < 16; i  )
    {
        <td>@Html.DisplayFor(m => m.NotAppropriate)</td>
    }
</tr>
<tr>
    <th style="text-decoration: underline darkgray">No Interaction Data</th>
    @for (int i = 0; i < 16; i  )
    {
<td>@Html.DisplayFor(m => m.NoInteraction)</td>
    }
</tr>
  

То, чего я пытаюсь достичь, похоже на рисунок ниже:

Вот рабочая демонстрация, как показано ниже:

Модель:

 public class TestViewModel
{
    public List<SessionViewModel> SessionList { get; set; }
}
public class SessionViewModel
{
    public int Id { get; set; }
    public int Day { get; set; }
    public int Date { get; set; }
    public int Appropriate { get; set; }
    public int NotAppropriate { get; set; }
    public int NoInteraction { get; set; }
}
  

Вид:

 @model TestViewModel
<form method="get" asp-action="details">
    <table class="table order-list">
        <thead>
            <tr>
                <th>amp;nbsp;</th>
                @for (int i = 1; i <= Model.SessionList.Count(); i  )
                {
                    <th>@i</th>
                }
            </tr>
        </thead>
        <tbody>
            <partial name="_ChartDetailsPartial" for="@Model.SessionList" />
        </tbody>
    </table>
</form>
  

Частичный просмотр:

 @model List<SessionViewModel>
<tr>
    <th>Day</th>
    @for (int i = 0; i < Model.Count(); i  )
    {
        <input type="hidden" asp-for="@Model[i].Id" />
        <td>@Html.DisplayFor(m => m[i].Day)</td>
    }
</tr>
<tr>
    <th width="200">Date</th>
    @for (int i = 0; i < Model.Count(); i  )
    {
        <td>@Html.DisplayFor(m => m[i].Date)</td>
    }
</tr>
<tr>
    <th style="text-decoration: underline limegreen">Appropriate Data</th>
    @for (int i = 0; i < Model.Count(); i  )
    {
        <td>@Html.DisplayFor(m => m[i].Appropriate)</td>
    }
</tr>
<tr>
    <th style="text-decoration: underline red">InAppropriate Data</th>
    @for (int i = 0; i < Model.Count(); i  )
    {
        <td>@Html.DisplayFor(m => m[i].NotAppropriate)</td>
    }
</tr>
<tr>
    <th style="text-decoration: underline darkgray">No Interaction Data</th>
    @for (int i = 0; i < Model.Count(); i  )
    {
        <td>@Html.DisplayFor(m => m[i].NoInteraction)</td>
    }
</tr>
  

Результат:

Вы можете сделать вот так,

 <form method="get" asp-action="details">
    <table class="table order-list">
        <thead>
            <tr>
                <th>amp;nbsp;</th>
                @for (int i = 1; i < 16; i  )
                {
                   <th>@i</th>
                }
            </tr>
        </thead>
        <tbody>
            <partial name="_ChartDetailsPartial" for="@Model.SessionList"/>
        </tbody>
    </table>
    </form>
  

Частичный просмотр

 @model List<TestApplication.Models.ViewModels.SessionViewModel>

@{
    ViewData["Title"] = "_ChartDetailsPartial";
}

@for (int i = 0; i < Model; i  )
{
    var session = Model[i];

<tr>
    <td>Day</td>
    @for (int i = 1; i < 16; i  )
    {
        <td>
              <input type="hidden" asp-for="Id" />
              @Html.DisplayFor(m => m.Day)
        </td>
    }
</tr>
<tr>
    <td width="200">Date</td>
    @for (int i = 1; i < 16; i  )
    {
        <td>@Html.DisplayFor(m => m.Date)</td>
    }
</tr>
<tr>
    <td style="text-decoration: underline limegreen">Appropriate Data</td>
    @for (int i = 1; i < 16; i  )
    {
       <td>@Html.DisplayFor(m => m.Appropriate)</td>
    }
</tr>
<tr>
    <td style="text-decoration: underline red">InAppropriate Data</td>
    @for (int i = 1; i < 16; i  )
    {
        <td>@Html.DisplayFor(m => m.NotAppropriate)</td>
    }
</tr>
<tr>
    <td style="text-decoration: underline darkgray">No Interaction Data</td>
    @for (int i = 1; i < 16; i  )
    {
      <td>@Html.DisplayFor(m => m.NoInteraction)</td>
    }
</tr>
}