数据库:
VS:
前端界面:
@{
ViewBag.Title = "Index";
}
@using WebApplication1.Models
@model List<Role>
<div style="display:flex;justify-content:space-between">
<div class="btn-group">
<button type="button" class="btn btn-default">新增</button>
<button type="button" class="btn btn-default">删除</button>
</div>
<div class="input-group">
<label>名称</label>
<input type="text" id="txtCondName" />
<input type="button" value="搜索" id="btnSearch" onclick="page(1);"/>
</div>
</div>
<table class="table table-bordered">
<thead>
<tr>
<th>编号</th>
<th>名称</th>
<th>备注</th>
</tr>
</thead>
<tbody>
@foreach (var item in Model)
{
<tr>
<td>@item.ID</td>
<td>@item.Name</td>
<td>@item.Remark</td>
</tr>
}
</tbody>
</table>
<nav aria-label="Page navigation" style="display:flex;justify-content:space-between">
<ul class="pagination">
<li><a href="/go.html?url=#">共10页，第<input type="text" value="1" id="pageIndex" width="100">页，每天显示<select id="pageSize" onchange="page(1);">
@{
var pageIndexs = new List<int> { 5, 6, 7, 8, 9, 10 };
}
@foreach (var item in pageIndexs)
{
if (ViewBag.pageSize == item)
{
<option value="@item" selected="selected">@item</option>
}
else
{
<option value="@item">@item</option>
}
}
</select>
</li>
</ul>
<ul class="pagination">
<li><a href="/go.html?url=javascript:page(1);">首页</a></li>
<li><a href="/go.html?url=javascript:page(@ViewBag.pageIndex-1)">上页</a></li>
<li><a href="/go.html?url=javascript:page(@ViewBag.pageIndex+1)">下页</a></li>
<li><a href="/go.html?url=javascript:page(@ViewBag.totalPage)">末页</a></li>
<li><input type="button" name="name" value="go" onclick="page(3);" /></li>
</ul>
</nav>
@section scripts{
<script>
function page(pageindex) {
var pageSize = $("#pageSize").val();
var name = $("#txtCondName").val();
window.location.href = "/role/index?pageIndex=" + pageindex + "&pageSize=" + pageSize + "&name=" + name
};
</script>
}
@{
ViewBag.Title
