테이블 MVC에서 아래쪽 화살표 위로 asp.net

Question

왼쪽에 위아래 버튼이있는 목록이 있습니다. "아래로"버튼과 "위로"버튼으로 마지막 테이블 행과 함께 첫 번째 테이블 행을 만드는 방법? 이것은 내 코드입니다.

@foreach (var item in Model) 
    {  
     <tr> 
      <td> 
       <a href="#" class="up">Up</a> | 
       <a href="#" class="down">Down</a> 
      </td> 
      <td class="personName"> 
       @Html.DisplayFor(modelItem => item.Name) 
      </td> 
      <td class="personOrder"> 
       @Html.DisplayFor(modelItem => item.Order) 
      </td> 
      <td> 
       @Html.ActionLink("Edit", "Edit", new { id = item.ID }) | 
       @Html.ActionLink("Details", "Details", new { id = item.ID }) | 
       @Html.ActionLink("Delete", "Delete", new { id = item.ID }) 
      </td> 
      <td> 
       <input type="hidden" class ="personID" value=@item.ID /> 
      </td> 
     </tr> 
    } 

Answer 1

당신은 간단하게 사용할 수 IEnumerable의 First() 및 Last() 작동하도록

@foreach (var item in Model) 
{  
    <tr> 
     <td> 
      @if(item != Model.First()) 
      { 
       <a href="#" class="up">Up</a> 
      } 
      @if(item != Model.Last()) 
      { 
       <a href="#" class="down">Down</a> 
      } 
     </td> 
     <td class="personName"> 
      @Html.DisplayFor(modelItem => item.Name) 
     </td> 
     <td class="personOrder"> 
      @Html.DisplayFor(modelItem => item.Order) 
     </td> 
     <td> 
      @Html.ActionLink("Edit", "Edit", new { id = item.ID }) | 
      @Html.ActionLink("Details", "Details", new { id = item.ID }) | 
      @Html.ActionLink("Delete", "Delete", new { id = item.ID }) 
     </td> 
     <td> 
      <input type="hidden" class ="personID" value=@item.ID /> 
     </td> 
    </tr> 
} 

Answer 2

변수를 정의하면 현재 색인을 추적하는 데 도움이됩니다. 이제는 현재 요소를 식별하는 것이 간단 해졌습니다. 또한 for 루프를 사용할 수 있습니다. 당신은 또한 CSS first-child 사용할 수

@{int x = 0;} 
@foreach (var item in Model) 
{ 
    <tr> 
     <td> 
      @if (x != 0) 
      { 
       <a href="#" class="up">Up</a> 
      } 
      @if (x != Model.Count() - 1) 
      { 
       <a href="#" class="down">Down</a> 
      } 
      x++; 
     </td> 
     <td class="personName"> 
      @Html.DisplayFor(modelItem => item.Name) 
     </td> 
     <td class="personOrder"> 
      @Html.DisplayFor(modelItem => item.Order) 
     </td> 
     <td> 
      @Html.ActionLink("Edit", "Edit", new { id = item.ID }) | 
      @Html.ActionLink("Details", "Details", new { id = item.ID }) | 
      @Html.ActionLink("Delete", "Delete", new { id = item.ID }) 
     </td> 
     <td> 
      <input type="hidden" class="personID" value=@item.ID /> 
     </td> 
    </tr> 
} 

Answer 3

귀하의 질문에 "일을 렌더링하는 방법"더 관련 것 때문에 :

TABLE TR:first-child a.up{display:none;} 
 
TABLE TR:last-child a.down{display:none;}

<table> 
 
    <tr> 
 
    <td> 
 
     <a href="#" class="up">Up</a> 
 
     <a href="#" class="down">Down</a> 
 
    </td> 
 
    <td> 
 
     anything 
 
    </td> 
 
    </tr> 
 
    <tr> 
 
    <td> 
 
     <a href="#" class="up">Up</a> 
 
     <a href="#" class="down">Down</a> 
 
    </td> 
 
    <td> 
 
     anything 
 
    </td> 
 
    </tr> 
 
    <tr> 
 
    <td> 
 
     <a href="#" class="up">Up</a> 
 
     <a href="#" class="down">Down</a> 
 
    </td> 
 
    <td> 
 
     anything 
 
    </td> 
 
    </tr> 
 
</table>