JQuery 带有 ASP.NET 个 Razor 页面的 bootgrid 插件
JQuery bootgrid plugin with ASP.NET Razor pages
我在 Razor 视图中有简单的 HTML table
<table id="grid" class="table table-condensed table-hover table-striped">
<tr>
<th data-column-id="Detail">
Detail
</th>
<th data-column-id="Client_Ref">
Client Ref
</th>
<th data-column-id="Acc">
Acc
</th>
</tr>
@foreach (var item in Model)
{
<tr>
<td>
@Html.ActionLink(" ", "Detail", new {
id = item.KeyOfTransaction},
new { @class = "btn btn-default glyphicon glyphicon-book" })
</td>
<td>
@Html.DisplayFor(modelItem => item.Client_Ref)
</td>
<td>
@Html.DisplayFor(modelItem => item.Acc)
</td>
</tr>
}
</table>
当我应用 JQuery Bootgrid 时,只显示搜索字段,但整个 table 变成空的
@section Scripts {
<script>
$(document).ready(function () {
$("#grid").bootgrid();
})
</script>
}
有人知道这里出了什么问题吗?我需要过滤数据、对其进行排序并执行此插件提供的所有其他操作
bootgrid
插件要求您将 table 行放入 tbody
标签,将 header 行放入 thead
标签
<table id="grid" class="table table-condensed table-hover table-striped">
<thead>
<tr>
<th data-column-id="Detail">
Detail
</th>
<th data-column-id="Client_Ref">
Client Ref
</th>
<th data-column-id="Acc">
Acc
</th>
</tr>
</thead>
<tbody>
@foreach (var item in Model) {
<tr>
<td>
@Html.ActionLink(" ", "Detail", new {
id = item.KeyOfTransaction},
new { @class = "btn btn-default glyphicon glyphicon-book" })
</td>
<td>
@Html.DisplayFor(modelItem => item.Client_Ref)
</td>
<td>
@Html.DisplayFor(modelItem => item.Acc)
</td>
</tr>
}
</tbody>
</table>
<thead>
和 <tbody>
标签缺失
示例
<table id="grid-basic" class="table table-condensed table-hover table-striped">
<thead>
<tr>
<th data-column-id="id" data-type="numeric">ID</th>
<th data-column-id="sender">Sender</th>
<th data-column-id="received" data-order="desc">Received</th>
</tr>
</thead>
<tbody>
<tr>
<td>10238</td>
<td>eduardo@pingpong.com</td>
<td>14.10.2013</td>
</tr>
...
</tbody>
</table>
我在 Razor 视图中有简单的 HTML table
<table id="grid" class="table table-condensed table-hover table-striped">
<tr>
<th data-column-id="Detail">
Detail
</th>
<th data-column-id="Client_Ref">
Client Ref
</th>
<th data-column-id="Acc">
Acc
</th>
</tr>
@foreach (var item in Model)
{
<tr>
<td>
@Html.ActionLink(" ", "Detail", new {
id = item.KeyOfTransaction},
new { @class = "btn btn-default glyphicon glyphicon-book" })
</td>
<td>
@Html.DisplayFor(modelItem => item.Client_Ref)
</td>
<td>
@Html.DisplayFor(modelItem => item.Acc)
</td>
</tr>
}
</table>
当我应用 JQuery Bootgrid 时,只显示搜索字段,但整个 table 变成空的
@section Scripts {
<script>
$(document).ready(function () {
$("#grid").bootgrid();
})
</script>
}
有人知道这里出了什么问题吗?我需要过滤数据、对其进行排序并执行此插件提供的所有其他操作
bootgrid
插件要求您将 table 行放入 tbody
标签,将 header 行放入 thead
标签
<table id="grid" class="table table-condensed table-hover table-striped">
<thead>
<tr>
<th data-column-id="Detail">
Detail
</th>
<th data-column-id="Client_Ref">
Client Ref
</th>
<th data-column-id="Acc">
Acc
</th>
</tr>
</thead>
<tbody>
@foreach (var item in Model) {
<tr>
<td>
@Html.ActionLink(" ", "Detail", new {
id = item.KeyOfTransaction},
new { @class = "btn btn-default glyphicon glyphicon-book" })
</td>
<td>
@Html.DisplayFor(modelItem => item.Client_Ref)
</td>
<td>
@Html.DisplayFor(modelItem => item.Acc)
</td>
</tr>
}
</tbody>
</table>
<thead>
和 <tbody>
标签缺失
示例
<table id="grid-basic" class="table table-condensed table-hover table-striped">
<thead>
<tr>
<th data-column-id="id" data-type="numeric">ID</th>
<th data-column-id="sender">Sender</th>
<th data-column-id="received" data-order="desc">Received</th>
</tr>
</thead>
<tbody>
<tr>
<td>10238</td>
<td>eduardo@pingpong.com</td>
<td>14.10.2013</td>
</tr>
...
</tbody>
</table>