Hi,
mir gelingt es ganz gut, die multisortable-Erweiterung in einem "trial_Error_Script" umzusetzen.
<html>
<head>
<script src="../vendor/jquery.js" type="text/javascript"></script>
<script src="../vendor/jquery-ui.js" type="text/javascript"></script>
<script src="../lib/jquery.multisortable.js" type="text/javascript"></script>
<script type="text/javascript">
jQuery(function($){
$('table.sortable').multisortable();
$('table#list1').sortable();
});
</script>
<style type="text/css">
tbody.selected { background-color:#F8BF74; }
</style>
</head>
<body>
<table id='list1' class="sortable">
<tobdy id='t_1'><tr><td>1</td><td>aaa</td></tr></tbody>
<tobdy id='t_2'><tr><td>2</td><td>bbb</td></tr></tbody>
<tobdy id='t_3'><tr><td>3</td><td>ccc</td></tr></tbody>
<tobdy id='t_4'><tr><td>4</td><td>ddd</td></tr></tbody>
<tobdy id='t_5'><tr><td>5</td><td>eee</td></tr></tbody>
<tobdy id='t_6'><tr><td>6</td><td>fff</td></tr></tbody>
<tobdy id='t_7'><tr><td>1aaaaaaaa</td><td>aaa</td></tr></tbody>
<tobdy id='t_8'><tr><td>2aaaaaaaaa</td><td>bbb</td></tr></tbody>
<tobdy id='t_9'><tr><td>3aaaaaaaa</td><td>ccc</td></tr></tbody>
<tobdy id='t_10'><tr><td>4aaaaaaaaa</td><td>ddd</td></tr></tbody>
<tobdy id='t_11'><tr><td>5aaaaaaaaaa</td><td>eee</td></tr></tbody>
<tobdy id='t_12'><tr><td>6aaaaaaaa</td><td>fff</td></tr></tbody>
</table>
</body>
</html>
Was mir nicht gelingt, ist das Zusammenspiel im "Echtscript".
Die Tabellenzeilen bzw. tbodys werden nicht farblich markiert und sie brechen mir weder in der Breite komplett ein.
Das Echtscript sieht derzeit so aus
$(function() {
$( "#mysortlist" ).sortable({
items: 'tbody:not(.ui-state-disabled)',
helper: function(event, element) {
helper = element.clone();
$('td', helper).each(function(index) {
$(this).width($('td', element).eq(index).width());
});
return helper;
},
forcePlaceholderSize: true,
placeholder: {
element: function() {
return '<tbody class="ui-sortable-placeholder"><tr><td colspan="9" align="middle">Ziel</td></tr></tbody>';
},
update: function(container, p) {
return;
}
},
}).disableSelection();
});
Ohne Multisortierung spielt das Echtscript wirklich gut und zufriedenstellend.
Aber das Trial_error_script ist auch sehr funktionabel.
Wie bekomme ich denn diese beiden unter "einen Hut" zu einem neuen "Echtscript"?
Ich habe es so versucht und das scheint zu funktionieren, aber da bricht mir eben die Zeilenbreite ein und die Zeilen bzw. tbody - Markierung funktioniert nicht.
$(function() {
$( \"#sort\" ).multisortable();
$( \"#sort\" ).sortable({
items: 'tbody:not(.ui-state-disabled)',
helper: function(event, element) {
... usw.
Den Style "tbody.selected { background-color:#F8BF74; }" hatte ich natürlich auch bhier hinterlegt.
Er wird auch angewendet, aber man sieht es nicht. :-(
Inzwischen ist mir der Scriptteil aber auch für weiteres Trial+Error etwas zu kompliziert geworden und ich gewinne zunehmends den Eindruck "ins Blaue hinein" zu versuchen. Sprich, mein Script wird für mich zur Wundertüte und selbst, wenns dann wie gewünscht laufen würde, würde ich mir nicht sicher sein können, dass das ganze Hand+Fuß hat und unter allen Umständen auch später funktionieren wird.
Ich weiß gar nicht, was ich jetzt fragen soll ;-)
Sicher hat Suit mir bereits alles gesagt, was auch zur Lösung dieses Problemes beitragen würde/wird. Aber ich bekomms grad nicht umgesetzt.
Gruß, Gerald