gpt4 book ai didi

c# - jQuery 可排序 : How to properly post element id array?

转载 作者:行者123 更新时间:2023-11-30 14:35:37 25 4
gpt4 key购买 nike

问题:

我正在使用 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/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com