• Das Erstellen neuer Accounts wurde ausgesetzt. Bei berechtigtem Interesse bitte Kontaktaufnahme über die üblichen Wege. Beste Grüße der Admin

[GELÖST] Datalist leeren

L

LionIV

New member
Hallo zusammen,
per
Code: 
 var list = document.getElementById("posPos"); 
     for (var i = 0, len = data.length; i < len -1; i++) {
         list.appendChild(new Option(data[i], data[i]));
     }

fülle ich folgende Datalist:

Code: 
  <input type="text" name="posEZ" list="posPos"  id='posEZ'  style='width:100px;'   value="">
               <datalist id="posPos">
               <!--wird per Script gefuellt -->
                </datalist>
             </input>

Ich möchte diese Liste nun vor dem Befüllen leeren, da sonst bei jeder Ausführung die Einträge angehängt werden.

ich habe das per

Code: 
  var childArray = document.getElementById("posPos").children;
    if (childArray.length > 0) {
        document.getElementById("posPos").removeChild(childArray[0]);
   }

versucht, funktioniert leider nicht.

Jemand ne Idee?


Ich danke euch
 
Zuletzt bearbeitet von einem Moderator:
im Schleifenkopf: = ist eine Zuweisung, links ok. aber mitte muss == oder === oder sein.

und warum sollen einträge raus und wieder rein?
 
mikdoe schrieb:
im Schleifenkopf: = ist eine Zuweisung, links ok. aber mitte muss == oder === oder sein.
Zum Vergrößern anklicken....
Sind doch 2 Zuweisungen, oder?
Code: 
var i = 0, len = data.length;

LionIV schrieb:
Code: 
 var list = document.getElementById("posPos"); 
     for (var i = 0, len = data.length; i < len -1; i++) {
         list.appendChild(new Option(data[i], data[i]));
     }
Zum Vergrößern anklicken....
Denke die Bedingung sollte bei deinem vermutlichen Array eher
Code: 
i < len;
oder
Code: 
i <= len -1;
sein.
LionIV schrieb:
Ich möchte diese Liste nun vor dem Befüllen leeren, da sonst bei jeder Ausführung die Einträge angehängt werden.

ich habe das per

Code: 
  var childArray = document.getElementById("posPos").children;
    if (childArray.length > 0) {
        document.getElementById("posPos").removeChild(childArray[0]);
   }

versucht, funktioniert leider nicht.
Zum Vergrößern anklicken....
Weil du nur einmal das erste Kindelement löschst...


Mit der richtigen Schleife funktionierts:
HTML: 
<!DOCTYPE html>
<html>
<head>
    <title>Datalist</title>
    <script>
    function add() {
        var node = document.getElementById("posPos"),
            data = ['option 1', 'option 2', 'option 3'],
            dataItem;

        while (data.length) {
            dataItem = data.shift();
            node.appendChild(new Option(dataItem, dataItem));
        }
    }

    function update() {
        var node = document.getElementById("posPos"),
            nodeChildren,
            data = ['option 1', 'option 3', 'option 4', 'option 5', 'option 6'],
            dataItem;

        while (data.length) {
            nodeChildren = node.children;
            dataItem = data.shift();
            for (var i = 0, len = nodeChildren.length; i < len; i = i + 1) {
                if (nodeChildren[i].value === dataItem) {
                    dataItem = '';
                }
            }
            if (dataItem !== '') {
                node.appendChild(new Option(dataItem, dataItem));
            }
        }
    }

    function remove() {
        var node = document.getElementById("posPos");

        while (node.children.length > 0) {
            node.removeChild(node.children[0]);
        }
    }
</script>
</head>

<body>
    <button type="button" onclick="add()">Add datalist</button>
    <button type="button" onclick="update()">Update datalist</button>
    <button type="button" onclick="remove()">Remove datalist</button>
    <input type="text" id="posEZ" name="posEZ" list="posPos" style="width:100px;" value="" />
    <datalist id="posPos"></datalist>
</body>
</html>
 
Zuletzt bearbeitet:
Eine Node komplett zu leeren geht am einfachsten und schnellsten so:
Code: 
document.getElementById("posPos").innerHTML = "";
 
Du musst dich einloggen oder registrieren, um hier zu antworten.
Zurück
Oben