JQery sortable Ausgabe der Positionen

[Axel]

Hallo,

versuche mich hier bei Jquery bei den sortable. Möchte zu den Items die Positionen nach Stop in hidden-felder schreiben.

Der JavaScript-Teil sähe so aus:

  
$(document).ready(function(){  
 // Das Element mit der ID sortable wird eine sortierbare Liste  
 $("#sortable").sortable({  
// Wenn in dieser Liste ein sortiervorgang enden, dann :  
  stop: function(event, ui) {  
// schreibe i.d. Wert von #sel1 die Position des Listenelements  
   $('.sel').val(ui.position);  
  }  
 });  
// Was das hier macht weiß ich gerade nicht :-D  
 $("#sortable").disableSelection();  
});  

Der Teil mit den HTML-Teil sähe so aus:

<div class="demo">  
  
<ul id="sortable">  
 <li class="ui-state-default"><span class="ui-icon ui-icon-arrowthick-2-n-s"></span>Item 1</li>  
 <li class="ui-state-default"><span class="ui-icon ui-icon-arrowthick-2-n-s"></span>Item 2</li>  
 <li class="ui-state-default"><span class="ui-icon ui-icon-arrowthick-2-n-s"></span>Item 3</li>  
 <li class="ui-state-default"><span class="ui-icon ui-icon-arrowthick-2-n-s"></span>Item 4</li>  
 <li class="ui-state-default"><span class="ui-icon ui-icon-arrowthick-2-n-s"></span>Item 5</li>  
 <li class="ui-state-default"><span class="ui-icon ui-icon-arrowthick-2-n-s"></span>Item 6</li>  
 <li class="ui-state-default"><span class="ui-icon ui-icon-arrowthick-2-n-s"></span>Item 7</li>  
</ul>  
  
</div><!-- End demo -->  
<form name="form_f4a" action="f5.php" method="post">  
<div id="sel1">  
<input class="sel" type="hidden" name="sel1">  
<input class="sel" type="hidden" name="sel2">  
<input class="sel" type="hidden" name="sel3">  
<input class="sel" type="hidden" name="sel4">  
<input class="sel" type="hidden" name="sel5">  
<input class="sel" type="hidden" name="sel6">  
<input class="sel" type="hidden" name="sel7">  
</div>  
</form>

[Axel]

In den hidden-Feldern wird mir hier überall [object Object] reingeschrieben. Das muss hier vom Object die Eigenschaft ausgelesen werden. Nur wie? Ich brauche die Positionen also die Werte bei der Auflistung, von 0 bis 6. Das heisst ich will wissen welches Item ist oben, welches ist zweites etc.

Kann mir jemand hier ein Tipp geben. Position reicht hier nicht aus, bzw. komme ich hier nicht weiter.

[Joachim]

Hi,

Kann mir jemand hier ein Tipp geben. Position reicht hier nicht aus, bzw. komme ich hier nicht weiter.

dann lass es Dir doch mal ausgeben:

... stop callback-funktion...
var txt = "";
for(var i in ui.position) {
    txt += i + ": " + ui.position[i] + "<br>";
}
$(document.body).append(txt);

Gruesse, Joachim

[Axel]

Hi,

Kann mir jemand hier ein Tipp geben. Position reicht hier nicht aus, bzw. komme ich hier nicht weiter.

dann lass es Dir doch mal ausgeben:

... stop callback-funktion...
var txt = "";
for(var i in ui.position) {
    txt += i + ": " + ui.position[i] + "<br>";
}
$(document.body).append(txt);

Gruesse, Joachim

Hi Joachim,

der gibt mir nur die Position von dem jeweiligen bewegten Item an.

Aber da hätte ich auch gern irgendeine Id oder so um zuzuordnen, welches div gerade bewegt wurde.

Gruss

[Joachim]

Hi,

Aber da hätte ich auch gern irgendeine Id oder so um zuzuordnen, welches div gerade bewegt wurde.

ui.item?
ggf $(ui.item).attr("id")

Gruesse, Joachim

[Axel]

Hi,

Aber da hätte ich auch gern irgendeine Id oder so um zuzuordnen, welches div gerade bewegt wurde.
ui.item?
ggf $(ui.item).attr("id")

Gruesse, Joachim

Das ist sehr gut. Vielen Dank.

Hier habe ich jetzt zumindest schon mal die id vom div, die bewegt wurde. Genial wäre es jetzt, wenn ich bei jeder Bewegung alle Positionen bekommen würde. So dass ich die Values von den hidden-Feldern aktuell anpassen kann.

Gruss Axel

[Joachim]

Hi,

Genial wäre es jetzt, wenn ich bei jeder Bewegung alle Positionen bekommen würde.

Loope im callback über alle items und stelle die aktuelle Reihenfolge fest:

var reihenfolge =  [];
$(ui.item).parent().find("wasauchimmerdufürelementehast").each(function(){
    reihenfolge.push($(this).attr("id"))
})

ungetestet und ohne Flinte ;-)

Gruesse, Joachim

[Axel]

Vielen, vielen Dank für diese Tipps.
Hatte mir auch schon each angeschaut. Gibt es da einen besonders zu empfehlenden Link oder Buchtipp zu dem Thema.

Gruss Axel

[Axel]

p.s. Ich frage mich bei dieser UI was das für einen Sinn hat, wenn hier überhaupt keine Methode direkt vorgesehen ist, die Position und id zum bewegten Item ausliest.