遍歷整個表格會導致向單個元素顯示多個值時出現問題-有解無憂

我對從 SQL 表向 HTML 動態添加資料沒有什么問題。

這是我的回圈

@foreach (var item in Model.ModulesSubStages)
{
    <div class="row">
        <div class="col-md-6"><a id="courseRedirect" asp-page="/Site/Courses/@item.ModuleId/@item.Id" class="w3-bar-item w3-button"> @item.StageName </a></div>
        <div class="col-md-6">
            @foreach (var monit in Model.ProgressMonitor)
            {
                if (monit.UserId == Model._User.Id && item.Id == monit.CourseSubStageId)
                {
                    <i class="bi bi-check-circle-fill" id="@item.Id" style="color:green;"></i>
                }
                else if (monit.UserId == Model._User.Id && item.Id != monit.CourseSubStageId)
                {
                    <i class="bi bi-check-circle-fill" id="@item.Id" style="color:gray;"></i>
                }
                else
                {
                    <i class="bi bi-check-circle-fill" id="@item.Id" style="color:gray;"></i>
                }
            }
        </div>
    </div>
}

ModulesSubStages = 9 項

ProgressMonitor - 完成某些操作后插入資料時的表

問題：

這個回圈結果是：

遍歷整個表格會導致向單個元素顯示多個值時出現問題

我想遍歷整個表格并在完成時標記為綠色，否則為灰色，我不想將每 1 條記錄列印到 html 多個值。

- 更新

這是 ProgressMonitor 表結構：

SELECT [Id]
      ,[CourseId]
      ,[CourseStageId]
      ,[CourseSubStageId]
      ,[UserId]
  FROM [ProgressMonitor];

uj5u.com熱心網友回復：

你不需要第二個回圈！

您只需使用 where 子句

@foreach (var item in Model.ModulesSubStages)
{
<div class="row">
    <div class="col-md-6"><a id="courseRedirect" asp-page="/Site/Courses/@item.ModuleId/@item.Id" class="w3-bar-item w3-button"> @item.StageName </a></div>
    <div class="col-md-6">
        @if (Model.ProgressMonitor.Any(a => a.UserId = Model._User.Id && item.Id == a.CourseSubStageId))
        {
            <i class="bi bi-check-circle-fill" id="@item.Id" style="color:green;"></i>
        }
        else
        {
            <i class="bi bi-check-circle-fill" id="@item.Id" style="color:gray;"></i>
        }
    </div>
</div>
}

uj5u.com熱心網友回復：

如下更改您的代碼；

@foreach (var item in Model.ModulesSubStages){
  <div class="row">
  <div class="col-md-6"><a id="courseRedirect" asp-page="/Site/Courses/@item.ModuleId/@item.Id" class="w3-bar-item w3-button"> @item.StageName </a></div>
  <div class="col-md-6">
    @foreach (var monit in Model.ProgressMonitor)
    {
        if (monit.UserId == Model._User.Id )
        {
         if (item.Id == monit.CourseSubStageId )
           {
            <i class="bi bi-check-circle-fill" id="@item.Id" style="color:green;"></i>
           {
              break;
             }
           }
         else if (item.Id != monit.CourseSubStageId )
            {
            <i class="bi bi-check-circle-fill" id="@item.Id" style="color:gray;"></i>
             {
              break;
             }
            }
        }
        
    }
   </div>
  </div>
}

轉載請註明出處，本文鏈接：https://www.uj5u.com/yidong/537408.html

標籤：C＃网页格式CSS网站剃刀页面

上一篇：js實作輸入范圍滑動，滑鼠快速滑動時會有卡頓

下一篇：孤立的CSS檔案不適用于EditForm輸入