Sérialiser jquery sortable

Question

J'ai creusé sur ce site et googling pendant un certain temps maintenant et je ne peux pas trouver une bonne solution à mon problème. Je voudrais pouvoir sauvegarder l'état de mes portlets jquery sur une page. Je préférerais ne pas avoir un bouton "enregistrer l'état" si je peux l'éviter.

Quoi qu'il en soit, je dois juste le code jquery copié à partir de leur exemple portlet:

$(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(); 
}); 

J'ai essayé d'ajouter $(".column").serialize() et $(".column").sortable('serialize') et comme ci-dessus, mais en utilisant à la place $(".portlet") ... Je créé une variable et définissez-le sur la valeur de la méthode serialize, mais il ne renvoie rien. Qu'est-ce que je fais mal?

Edit: Voici le code de la colonne avec un portlet intérieur:

<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

Je fini par résoudre avec ce code:

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

qui sérialise chaque colonne au lieu de seulement la première colonne.

Answer 2

Vos portlets ont un attribut id?

De l'docs

Si serialize retourne une chaîne vide, assurez-vous que les attributs id comprennent une

Souligner

Answer 3

vous souhaitez utiliser la fonction .toArray() de sortable.

de la jquery triables documentation:

toArray

Signature: .sortable ("toArray")

sérialisés de id article du sortable dans un tableau de chaîne. Si vous avez

<ul id="a_sortable"><br> 
<li id="hello">Hello</li><br> 
<li id="goodbye">Good bye</li><br> 
</ul> 

et faire

var result = $('#a_sortable').sortable('toArray'); 

puis

résultat [0] contiendra "bonjour" et résultat [1] contiendra "au revoir".

afin de pouvoir enregistrer l'état, vous devez avoir une sorte d'appel ajax pour l'option de changement qui appelle la .sortable (« toArray ») et vous aurez un bon choix de l'ID dans l'ordre.