Question

我想用bootstrap设计我的Webgrid页面，但是找不到任何好方法。

我找到了这个包https://www.nuget.org/packages/WebGridBootstrapPagination/ 但我不知道在安装后使用它。

这是我的webgrid的一部分

@model IEnumerable<AnalyticConfig.Models.User>
@{
  var grid = new WebGrid(Model, ajaxUpdateContainerId: "ajaxgrid",    ajaxUpdateCallback: "webgrid", rowsPerPage: 5);
  grid.Pager(WebGridPagerModes.All);
}


    <div id="ajaxgrid" class="row panel-body table-responsive">
    @grid.GetHtml(
    tableStyle: "table table-striped table-list table-hover",
    columns: grid.Columns(
                grid.Column(canSort: false, style: "col-md-2", format: 
                @<text>
                    <a href='#' class="btn btn-info glyphicon glyphicon-pencil display edit-btn"></a>
                    <a href="#" class="btn btn-success glyphicon glyphicon-ok modify save-btn"></a>
                    <a href="#" class="btn btn-warning glyphicon glyphicon-remove modify cancel-btn"></a>
                    <a href="#" class="btn btn-danger glyphicon glyphicon-trash display delete-btn"></a>
                </text>),
                grid.Column(null, null, style:"hidecol", format: @<input type="hidden" id="in_ID" value="@item.Id" />),
                grid.Column("SchoolUnit", "Skolenhet", style: "col-md-2", format:
                @<text>
                    <span class="display"><label id="lbl_unit">@item.SchoolUnit</label></span>
                    @Html.DropDownList("in_unit", new SelectList(ViewBag.schoolUnitList, "Text", "Value", @item.SchoolUnit), new { @class = "form-control modify" })
                </text>),
                grid.Column("Name", "Namn", style: "col-md-2", format:
                 @<text>
                    <span class="display"><label id="lbl_name">@item.Name</label></span>
                    <input type="text" id="in_name" value="@item.Name" class="form-control modify" />
                </text>)

    )
    </div>

如果您知道如何使用该包裹或了解其他任何方式，请告诉我。

Answer 1

我的解决方案。没有为webgrid分页添加自定义css或html

<?xml version="1.0" encoding="UTF-8"?>
<a>19 Jan, 2017 , 12.06PM IST</a>

结果

在webgrid中实现bootstrap分页

1 个答案: