У меня есть код Html, который генерирует таблицу, содержащую много записей.
Вот код:
@model IEnumerable<UserContact>
@{
ViewBag.Title = "Contacts:";
}
<h2>
Contacts</h2>
<table>
<tr>
<th>
@Html.DisplayText("First Name")
</th>
<th>
@Html.DisplayText("First Name")
</th>
<th>
@Html.DisplayText("Email")
</th>
<th>
</th>
</tr>
@foreach (var item in Model)
{
<tr>
<td>
@Html.CheckBox("misha", new { onclick = "this.form.submit();" })
</td>
<td>
@Html.DisplayFor(modelItem => item.firstName)
</td>
<td>
@Html.DisplayFor(modelItem => item.lastName)
</td>
<td>
@Html.DisplayFor(modelItem => item.email)
</td>
</tr>
}
</table>
Этот код содержится на странице частичного просмотра бритвы.
У меня вопрос, как я могу создать разбиение на страницы в таблице, описанной выше?
2 ответа
В соответствии с вашим комментарием я показываю полный пример данных здесь:
Ссылки на JQuery и CSS: -
Ссылки: -
http://code.jquery.com/jquery-1.11.1.min.js
http://cdn.datatables.net/1.10.2/js/jquery.dataTables.min.js
http://cdn.datatables.net/1.10.2/css/jquery.dataTables.min.css
Ваше частичное представление: -
@model IEnumerable<UserContact>
@{
ViewBag.Title = "Contacts:";
}
<h2>
Contacts</h2>
<table id="mydatatable">
<thead>
<tr>
<th>
@Html.DisplayText("First Name")
</th>
<th>
@Html.DisplayText("First Name")
</th>
<th>
@Html.DisplayText("Email")
</th>
<th>
</th>
</tr>
<thead>
<tbody>
@foreach (var item in Model)
{
<tr>
<td>
@Html.CheckBox("misha", new { onclick = "this.form.submit();" })
</td>
<td>
@Html.DisplayFor(modelItem => item.firstName)
</td>
<td>
@Html.DisplayFor(modelItem => item.lastName)
</td>
<td>
@Html.DisplayFor(modelItem => item.email)
</td>
</tr>
}
<tbody>
</table>
<script type="text/javascript">
$(document).ready(function(){
$('#mydatatable').dataTable();
});
</script>
И последнее, но не менее важное: не забудьте добавить на свою страницу ссылки на необходимые файлы jquery.
//cdn.datatables.net/1.10.2/css/jquery.dataTables.min.css
//cdn.datatables.net/1.10.2/js/jquery.dataTables.min.js
/////////////////////////////////////
<table id="myTable">
<tr>
<th>
@Html.DisplayText("First Name")
</th>
<th>
@Html.DisplayText("First Name")
</th>
<th>
@Html.DisplayText("Email")
</th>
<th>
</th>
</tr>
@foreach (var item in Model)
{
<tr>
<td>
@Html.CheckBox("misha", new { onclick = "this.form.submit();" })
</td>
<td>
@Html.DisplayFor(modelItem => item.firstName)
</td>
<td>
@Html.DisplayFor(modelItem => item.lastName)
</td>
<td>
@Html.DisplayFor(modelItem => item.email)
</td>
</tr>
}
</table>
<script type="text/javascript">
$(document).ready(function(){
$('#myTable').dataTable();
});
</script>
Похожие вопросы
Новые вопросы
html
HTML (язык гипертекстовой разметки) — это язык разметки для создания веб-страниц и другой информации, отображаемой в веб-браузере. Вопросы относительно HTML должны включать минимальный воспроизводимый пример и некоторое представление о том, чего вы пытаетесь достичь. Этот тег редко используется отдельно и часто в паре с [CSS] и [JavaScript].