Question

我一直在这个网站上挖掘并且谷歌搜索了一段时间，我找不到一个很好的解决方案来解决我的问题。我希望能够在页面上保存我的jquery portlet的状态。如果我可以避免，我宁愿没有“保存状态”按钮。

无论如何，我只是从他们的portlet示例中复制了jquery代码：

$(function() {
    $(".column").sortable({
        connectWith: '.column'
    });

    $(".portlet").addClass("ui-widget ui-widget-content ui-helper-clearfix ui-corner-all")
        .find(".portlet-header")
            .addClass("ui-widget-header ui-corner-all")
            .prepend('<span class="ui-icon ui-icon-minusthick"></span>')
            .end()
        .find(".portlet-content");

    $(".portlet-header .ui-icon").click(function() {
        $(this).toggleClass("ui-icon-minusthick").toggleClass("ui-icon-plusthick");
        $(this).parents(".portlet:first").find(".portlet-content").toggle();
    });

    $(".column").disableSelection();
});

我尝试添加$(".column").serialize()和$(".column").sortable('serialize')，但与上面相同，但使用$(".portlet")代替...我创建了一个变量并将其设置为serialize方法的值，但它什么也没有回报。我做错了什么？

编辑：以下是包含portlet的列的代码：

 <div class="column" id="column_1">

<div class="portlet" id="portlet_1">

<div class="portlet-header">Times</div>
&nbsp Longest:
<div class="portlet-content">

<ChartFXGauge:DigitalPanel ID="LongestTimePanel" runat="server" >
</ChartFXGauge:DigitalPanel>
<p>
<a href="LongestORTime.aspx">(BySurgeon)</a>
</p>
</div>
</div>
</div>

Answer 1

我最终用这段代码解决了：

$(".column").each(function() {
alert($(this).sortable("toArray"));
});

序列化每列而不是第一列。

Answer 2

你想使用sortable的.toArray（）函数。

来自jquery可排序文档的

：

指定者

签名：       .sortable（“toArray”）

序列化可排序的项目ID   成一个字符串数组。如果你有
<ul id="a_sortable"><br>
<li id="hello">Hello</li><br>
<li id="goodbye">Good bye</li><br>
</ul>
并做
var result = $('#a_sortable').sortable('toArray');
然后

result [0]将包含“hello”和   结果[1]将包含“再见”。

所以为了能够保存状态，你必须对调用.sortable（'toArray'）的更改选项进行某种ajax调用，你将拥有一个很好的数组的顺序。

Answer 3

您的portlet是否具有id属性？

来自docs

如果serialize返回一个空字符串，确保id属性包含下划线

序列化jquery可排序

3 个答案: