0

こんにちは、コンテンツを並べて配置する方法を教えてください。

現在、コンテンツを左側と右側に別々に表示できます。しかし、データベースからレコードを表示する必要があります。このために、foreach ループを使用しています。したがって、どのように表示する必要があるかは、左側に 1 番目のレコード、右側に 2 番目のレコード、左側に 3 番目のレコードなどです。どうすればこのようにループできますか。

ここで立ち往生しています。助けが必要です..

このコードを使用していますが、前に言ったようにすべてのコンテンツが表示されています。

   <body>
   @foreach (var item in Model)

        {
  <!-- Main Table(You can define padding accordingly) -->
    <table width="80%" border="0" cellspacing="0" cellpadding="5">
  <tr>
  <td width="50%">

   <!-- Table on left side -->
  <table width="100%" border="0" cellspacing="0" cellpadding="1">
    <tr>
  <td>
  <span class="Title">APP</span>
  <br/>
    <div class="listRowA" onmouseover="this.className='listRowAHover'" onmouseout="this.className='listRowA'">
    <div class="listPageCol"  onclick="location.href='../Home/ControlPanel'">
    <span class="listlCol1">

          <br />
             @item.ID
            </span>
      <span class="listCol2"><img src="../Content/Images/20_thumb.jpg" width="281" height="200" border="0" alt="image"  /></span>


         </div>
        </div>

      </td>

      </tr>

    <tr>
    <td>&nbsp;</td>
   <td></td>
   <td>&nbsp;</td>
   </tr>
    <tr>
   <td>&nbsp;</td>
   <td> </td>
   <td>&nbsp;</td>
  </tr>
  </table>
  <!-- END -->
  </td>
  <td width="50%">

  <!-- Table on right side -->
  <table width="100%" border="0" cellspacing="0" cellpadding="1">
  <tr>

   <td>
  <div class="listRowA" onmouseover="this.className='listRowAHover'"  onmouseout="this.className='listRowA'">
    <span class="listCol2"><img src="../Content/Images/20_thumb.jpg" width="281"  height="200" border="0" alt="image"  /></span></div>
    </td>
     </tr>
   <tr>
  <td>&nbsp;</td>
  <td></td>
   <td>&nbsp;</td>
  </tr>
   <tr>
  <td>&nbsp;</td>
  <td> </td>
 <td>&nbsp;</td>
   </tr>
 </table>
  <!-- END -->
   </td>
  </table>

<!-- END OF MAIN TABLE -->
    }
 </body>
4

2 に答える 2

1

このパターンを使用すると、好きなだけ列を作成できます。html テーブルを使用している場合は、コレクションの合計サイズが で割り切れない場合に空白のセルが必要かどうかもテストする必要がありますcolumns。

@{
    int columns = 3;
}

@for (int i = 0; i < Model.Count; i++)
{
    var currentModel = Model[i];

    int col = i % columns;

    if (col == 0)
    {
        // left
    }
    else if (col == 1)
    {
        // middle
    }
    else  // col == 2
    {
        // right
    }
}
于 2013-09-12T23:59:05.003 に答える