0
我很新的ASP.NET和尝试建立购物应用程序。我使用jquery.datatable和Ajax显示在表店里的所有项目:ASP.NET的jQuery数据过滤
@model IEnumerable<OnlineShoppingApp.Models.Category>
@{
ViewBag.Title = "Index";
Layout = "~/Views/Shared/_Layout.cshtml";
}
<div class="col-md-2">
<ul id="categories">
@foreach(var category in Model)
{
<li data-category-id="@category.Id">@category.Name</li>
}
</ul>
</div>
<div class="col-md-10">
<table id="items" class=" table table-bordered table-hover">
<thead>
<tr>
<th>Name</th>
<th>Description</th>
<th>Price</th>
<th>Category</th>
</tr>
</thead>
<tbody></tbody>
</table>
</div>
@section Scripts {
<script>
$(document).ready(function() {
$("#items").DataTable(
{
ajax:
{
url: "/api/items",
dataSrc: ""
},
columns:
[
{
data: "Name",
},
{
data: "Description",
},
{
data: "Price",
},
{
data: "Category.Name",
}
]
}
)
$("li").click(function() {
var element = $(this);
});
});
</script>
}
而且在CategoryController:
public ActionResult Index()
{
var categories = context.Categories.ToList();
return View(categories);
}
在左边我列出所有类别,当点击一个我想过滤这个数据表只显示匹配所选类别的项目。我不想让页面重新加载,我也不知道从哪里开始。
查看https://datatables.net/reference/option/ajax – Shoe