如何在表格中添加垂直滚动条(剃刀视图)

时间:2016-10-12 09:53:02

标签: html jquery-ui scrollbar

我正在努力在我的视图中添加一个垂直滚动条(razor / html)。 我想将它放在包含我的数据的数据中。我已经尝试但没有成功。

如果可能,需要一些帮助。

<table id = "MenuItem"  class="promo full-width alternate-rows" style="text-align: center; ">  <!-- Cedric Kehi DEMO CHANGE -->



            <tr>
                <th>Product Code
                </th>

                <th>Description <!-- JACK EDIT -->
                </th>
                <th>Product Size
                </th>
                <th>Product Material
                </th>
                <th>Excluded?
                </th>
                <th>Order
                </th>
                <th>Actions</th>
            </tr>


        <tbody id ="scroll" style="overflow : scroll">


        @foreach (var item in Model.IndexList.OrderBy(x => x.ShuffleFunction))
        {




            <tr id ="trendingDisplay" data-model="model-1">



                    <td class="center-text">
                        @Html.DisplayFor(modelItem => item.ProductCode)
                    </td>
                   @* <td>
                        @Html.DisplayFor(modelItem => item.ProductTemplate.Description)
                    </td>*@
                    <td>
                        @Html.DisplayFor(modelItem => item.Description)
                    </td>
                    <td>
                        @Html.DisplayFor(modelItem => item.Size.SizeTitle)
                    </td>
                    <td>
                        @Html.DisplayFor(modelItem => item.Material.MaterialName)
                    </td>
                    <td>
                    @Html.DisplayFor(modelItem => item.GreyOut)
                    </td>
                    <td>
                    @Html.DisplayFor(modelItem => item.ShuffleFunction)
                    </td>
                    <td class="center-text nowrap">
                        @Html.ActionLink(" ", "Edit", new { id = item.ProductID }, new { title = "Edit", @class = "anchor-icon-no-text edit" })
                        @Html.ActionLink(" ", "Details", new { id = item.ProductID }, new { title = "Details", @class = "anchor-icon-no-text details" })
                        @Html.ActionLink(" ", "Delete", new { id = item.ProductID }, new { title = "Delete", @class = "anchor-icon-no-text delete" })

  <input class ="greyout" type="checkbox"  name="grey" id="trending" />


                </td>

            </tr>



        }


            </tbody>

    </table>

1 个答案:

答案 0 :(得分:0)

将表格元素包装在一个容器中并给它一个固定的高度并设置overflow属性。

for (n in names(IOlow)) {
    # convert all strings to double
    if ("character" %in% class(IOlow[,n])) {
        IOlow[n] <- lapply(IOlow[n], as.double)
    }
}