[Erledigt] Namen in Gruppen verschieben Mootools

[unglaublich]

Hi Leute, folgendes Problem:
- Ich möchte Namen in jeweilig dynamisch erstelle Gruppen verschieben, leider funktioniert dies nur bedingt sobald ich das Script dynamisch gestalte, das heisst wenn ich die Inputs keine festen Namen gebe.

Ich weiß wo der Fehler liegt aber kriegs nicht hin

Erstmal der Code:

    <script type="text/javascript">
    
    window.addEvent('domready', function(){
    //Inputs erstellen
    obj = document.getElementsByTagName("ul");
    for (var i = 0; i < obj.length; i++) {
    var myBox = document.createElement("input");
    myBox.setAttribute("name","group[]");
    myBox.setAttribute("id", "box" + obj[i].id);
    document.getElementById("derdiv").appendChild(myBox);
    }
    //Sortierbar machen
    var mySortables = new Sortables('#main, #prod1, #prod2', {
    constrain: false,
    clone: true,
    revert: true,
    onComplete: function(data){
    saveOrder(data)
    }
    });
    });
    //in Inputs speichern
    function saveOrder (data) {
    var grpList = "";
    ID = data.parentNode.id;
    orderDivs = document.getElementById("prod1").getElementsByTagName("li"); // fest
    //orderDivs = data.parentNode.getElementsByTagName("li"); //dynamisch
    for (i = 0; i < orderDivs.length; i++) {
    var entryId = orderDivs[i].firstChild.nodeValue;
    grpList += entryId + ";";
    }
    document.getElementById('boxprod1').value = grpList; // fest
    //document.getElementById('box' + ID).value = grpList; // dynamisch
    
    }
    </script> 

Body:

<div id="derdiv">
<ul class="myList anotherList" id="main">
<li>Item #1</li>
<li>Item #2</li>
<li>Item #3</li>
<li>Item #4</li>
<li>Item #5</li>
<li>Item #1</li>
</ul>

<ul class="myList anotherList" id="prod1">
</ul>

<ul class="myList anotherList" id="prod2">
</ul>

</div> 

Der Fehler liegt oben in der grpList, ich habs schon mit nem Array probiert aber das ging nicht. "undefined" erscheint dann in den Boxes.
Die dynamisch erstellten Inputs bau ich später als hidden um damit ich mit php weiter arbeiten kann.
Wenn ich jetzt die dynamischen Zeilen aktiviere und die festen deaktiviere funktioniert es zwar, ABER er löscht dann die Namen nicht wieder aus der Box, ich müsste erneut auf die Liste klicken aber das is ja mist ;\

Ich hoffe ich habe mein Problem gut erläutert, bei Fragen raus damit.

// EDIT

document.getElementById('box' + ID).value = grpList; 

Hier liegt der Fehler, er schreibt nur ins neue Input und bearbeitet die andern nicht :S
Bsp:
Wenn Name1 ich aus Prod1 in Prod2 verschiebe löscht er Name1 in Prod1 nicht

Jmd ne Idee parat, denke mit IF prüfen ob der name existiert wäre zu umständlich, das muss einfacher gehen.

[rudygotya]

Beschäftige dich mit den selectors von mootools, dann musst du dich nicht mit allen wiederkehrenden Problemen herumschlagen.

The Internet Explorer Problem

IE works correctly on elements that CAN'T have a name attribute. It works incorrectly, however, on elements that can

siehe auch hier

Du solltest dir angewöhnen, deinen code zu formatieren. So blickst du schnell selbst nicht mehr durch.

grüße

[unglaublich]

danke für den tipp, aber selbst wenn ich die selectors von mootools nutze behebt das nicht mein problem

mein problem ist ja das er das alte input nicht mehr bearbeitet sondern direkt ins neue schreibt (was ja auch logisch ist), aber ich nicht weiß wie ich den befehl definieren muss damit er beim alten input den namen wieder rausnimmt und ins neue schreibt

[rudygotya]

Hast du die "Problemseite" online? Fehlermeldungen?

[unglaublich]

Sortables Demo

es gibt kein fehler, wie soll ich sagen, es fehlt halt ein befehl.

verschiebe einfach nen namen ins rechte feld, von da wieder eins nach rechts.
die 3 textareas sollen anzeigen was gerade in der gruppe steht (soll eigtl ein hidden field sein)

[unglaublich]

Ich hoffe die Formation is angenehmer

die Lösung zum Problem:

    <script type="text/javascript">
    window.addEvent('domready', function(){
    var ids = [];
    var obj = $$("ul");
    for (var i = 0; i < obj.length; i++) {
        var myBox = new Element('input', {
            'name': 'groups[]',
            'id': 'box_' + obj[i].id,
            'type': 'hidden'
        });
        $("dragdrop").appendChild(myBox);
        ids.push(obj[i].id);
    }
    var mySortables = new Sortables($$('ul'), {
        constrain: false,
        clone: true,
        revert: true,
        onComplete: function(data){
            for(var i=0; i<ids.length; i++) {
            saveOrder(ids[i])
            }
        }
    });
    });
    function saveOrder (ID) {
        var grpList = "";
        orderDivs = $(ID).getElements("li");
        for (i = 0; i < orderDivs.length; i++) {
            var entryId = orderDivs[i].firstChild.nodeValue;
            grpList += entryId + ";";
        }
        $('box_' + ID).value = grpList;
     }
    </script> 

Die ID muss global gesetzt werden