在表MVC asp.net中向上箭头

时间:2017-11-21 09:09:58

标签: asp.net-mvc razor

我在左边有一个带有向上和向下按钮的列表。如何使用“向下”按钮创建第一个表行,使用“向上”按钮创建最后一个表行?这是我的代码。

@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>
    }

3 个答案:

答案 0 :(得分:0)

您可以定义变量以帮助您跟踪当前索引。现在识别当前元素变得简单了。也可以用于循环。

@{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>
}

答案 1 :(得分:0)

由于您的问题似乎与“应该如何渲染”更相关,您还可以使用CSS first-child

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>

答案 2 :(得分:0)

您只需使用IEnumerable&#39; 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>
}