我有一个显示数据表的简单 View ,我想在 AJAX 单击标题时对其列之一进行排序,我是 AJAX 和 JS 的新手,所以这是我在 View 中的尝试:
<table id="tbl" class="table">
<tr>
<th>
<a style="cursor: pointer" onclick="getData('desc')" id="sort">Title</a>
</th>
<th>
Author
</th>
<th></th>
</tr>
</table>
@section scripts{
<script type="text/javascript">
$(document).ready(getData('asc'))
function getData(sort) {
var srt = sort;
$.ajax({
type: 'GET',
url: '/Book/BooksData/' + srt,
dataTtype: 'json',
success: function (data) {
$("#tbl > tr").remove();
$.each(data, function (index, val) {
$('#tbl').append('<tr><td>' + val.Title + '</td><td>' + val.Author.Name + '</td></tr>')
});
}
});
}
</script>
}
但是当我单击标题时,sort
参数在操作中变为 null,
public JsonResult BooksData(string sort)
{
var books = new List<Book>();
if (sort == "asc") books = db.Books.Include(b => b.Author).OrderBy(b => b.Title).ToList();
else books = db.Books.Include(b => b.Author).OrderByDescending(b => b.Title).ToList();
return Json(books, JsonRequestBehavior.AllowGet);
}
是的,我做错了,但我修改了很多次,我看不到逻辑错误,除了在 JavaScript 中传递参数与 C# 不同
最佳答案
这是最简单的方法。您需要使用query
字符串将sort
值连接到url
。
现在,当您单击标题时,排序参数必须与您在操作中的值一致。
请试试这个:
$.ajax({
type: 'GET',
url: '/Book/BooksData?sort=' + srt,
dataType: 'json',
success: function (data) {
$("#tbl > tr").remove();
$.each(data, function (index, val) {
$('#tbl').append('<tr><td>' + val.Title + '</td><td>' + val.Author.Name + '</td></tr>')
});
}
});
另一种方法是使用这个:
url: '@Url.Action("BooksData","Book")?sort=' + srt
@Url.Action
只返回一个字符串。
在 Razor
中,每个使用 @ block 的内容都由 Razor
自动编码。
关于javascript - 如何从javascript函数向Action发送参数?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/41171795/