如何在jquery.bootgrid中添加水平滚动条

Question

我正在使用jquery bootgrid来显示一些数据（http://www.jquery-bootgrid.com/），请问有人能帮忙给这个网格添加水平滚动条吗？

我尝试将其放入带有overflow-x样式的div中，但它会将导航和分页一起滚动。

如果不可能的话，您能否推荐具有此功能的免费ASP .NET MVC网格？

- Yuiry.Vasilyev

Answer 1

尝试使用以下方式设置CSS类"bootgrid-table":

display: block;
width: 50px;
overflow-x: scroll;

我为了测试把宽度设置为50像素，但它可能可以保留原来的100%。不过，由于数据折叠显示“...”，我不确定除了去掉这个是否还能起作用。

- Master DJon

---

非常感谢！我移除了 width: 50px; 然后一切都很顺利！ - Yuiry.Vasilyev

Answer 2

由于您已经在使用Bootstrap，因此可以将table-responsive类添加到表元素的外部div中。

<div class="table-responsive">
   <table id="myTable" class="table table-bordered table-condensed table-hover">


   </table>

</div>


<script type="text/javascript">

$(function(){
  var dt = $('#myTable').bootgrid({
          selection: true,
          rowSelect: true,
          converters: {},
        });
});

</script>

Fiddle: https://jsfiddle.net/u5w4w24s/1/

- Dawood Awan