问题:
我正在使用 jQuery sortable。
我使用了这个教程:
http://www.xmech.net/programming/jquery-ui-sortable-tutorial/
现在这给了我一个像这样的字符串:
ID[]=2&ID[]=3&ID[]=4&ID[]=1
或者更糟的是，当我调用 id 的 IDa_1、IDb_2、IDc_3、IDd_4 时，它会给我
IDb[]=2&IDc[]=3&IDd[]=4&IDa[]=1
我发现这种格式非常可怕和无用...... 我只想要页面:["IDb_2"、"IDc_3"、"IDd_4"、"IDa_1"] 并具有数组索引中元素的顺序。
为了纠正这个问题，我做了:
var xxx = { pages: $(this).sortable('toArray') };
alert(JSON.stringify(xxx));
这是我的家庭 Controller :
public string SaveSortable(string pages)
{
string strPages = Request.Params["pages"];
Console.WriteLine(pages);
return pages;
}
public ActionResult Sortable()
{
return View();
} // End Action Sortable
问题是，“pages”和 strPages 始终为空...
虽然它进入了正确的 Controller ......
我做错了什么？
这是我的.cshtml:
@{
Layout = null;
}
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title></title>
<style type="text/css" media="all">
html {margin: 0px; padding: 0px; height: 100%;}
body {margin: 0px; padding: 0px; height: 100%;}
input{margin: 0px; padding: 0px; }
</style>
<style type="text/css" media="all">
.menu li
{
list-style: none;
padding: 10px;
margin-bottom: 5px;
border: 1px solid #000;
background-color: #C0C0C0;
width: 150px;
display: inline;
}
</style>
<script type="text/javascript" src="@Url.Content("~/Scripts/jQuery/jquery-1.7.2.min.js")"></script>
<script type="text/javascript" src="@Url.Content("~/Scripts/jQuery/jquery-ui/1_8_21/js/jquery-ui-1.8.21.custom.min.js")"></script>
<script type="text/javascript" language="javascript">
Date.prototype.getTicksUTC = function () {
return Date.parse(this.toUTCString()) + this.getUTCMilliseconds();
} // End Function getTicksUTC
var tickURL = '@Url.Content("~/Scripts/jQuery/SlickGrid/images/tick.png")';
$(document).ready(function () {
//$('#menu-pages').sortable();
$("#menu-pages").sortable({
update: function (event, ui) {
alert("posting");
//var ElementsOrder = $(this).sortable('toArray').toString();
var ElementsOrder = $(this).sortable('toArray');//.toString();
//alert(JSON.stringify(ElementsOrder));
var xxx = { pages: $(this).sortable('toArray') };
//alert(JSON.stringify(xxx));
//document.writeln("<h1>"+ JSON.stringify(xxx) + "</h1>");
// $.post("@Url.Action("SaveSortable", "Home")?no_cache=" + new Date().getTicksUTC(), { pages: $('#menu-pages').sortable('serialize') });
// $.post("@Url.Action("SaveSortable", "Home")?no_cache=" + new Date().getTicksUTC(), { pages: $('#menu-pages').sortable('serialize', { key: 'id' }) });
$.post("@Url.Action("SaveSortable", "Home")?no_cache=" + new Date().getTicksUTC(), { pages: $(this).sortable('toArray') });
}
});
});
</script>
</head>
<body>
<ul class="menu" id="menu-pages">
<li id="ID_1">Home</li>
<li id="ID_2">Blog</li>
<li id="ID_3">About</li>
<li id="ID_4">Contact</li>
</ul>
</body>
</html>
最佳答案
只需使用 JSON 请求:
$('#menu-pages').sortable({
update: function (event, ui) {
$.ajax({
url: '@Url.Action("SaveSortable", "Home")',
type: 'POST',
cache: false,
contentType: 'application/json',
data: JSON.stringify({ pages: $(this).sortable('toArray') }),
success: function(result) {
// ...
}
});
}
});
然后:
[HttpPost]
public ActionResult SaveSortable(string[] pages)
{
// pages will contain what you need => a list of ids
...
}
作为记录，这里是 JSON 请求 POST 负载的样子:
{"pages":["ID_2","ID_3","ID_1","ID_4"]}
关于c# - jQuery 可排序 : How to properly post element id array?，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/11790841/