Jörg Kruses Webmaster-Forum > JavaScript

Tabelle sortieren [5]

41 Jörg Kruse

Man muss imer die childNodes[0] löschen, weil nach dm Löschen die childNodes[1] zur childNodes[0] wird

		for (var i = 0; i < Anzahl; i++) {
        var Zeilenloeschen = document.getElementById("Tabelle2").childNodes[0];
            document.getElementById("Tabelle2").removeChild(Zeilenloeschen);
        }

42 Jerry02

achso! mensch so ein blöder Denkfehler aber auch!
so jetzt muss ja das array sozusagen wieder in die tabelle eingefügt werden.

ich hatte da an sowas gedacht:

		for (var i = 0; i < Anzahl; i++) {
		document.getElementById("Tabelle2").appendChild(Unsortiert);
		}

aber das funktioniert noch nicht. bestimmt weil ich nicht einfach das Array als Child einfügen kann! muss ich da jetzt vielleicht das selbe machen wie in der function Aendern(), also:

        var newTR = document.createElement("tr");
        document.getElementById("Tabelle2").appendChild(newTR);
        document.getElementById("Tabelle2").lastChild.id="tr" + timestamp;
        var newTD1 = document.createElement("td");
        newTD1.innerHTML = '<p id="WKN1">' + WKN + '</p><a href="javascript:Aendern()"></a>';
        newTR.appendChild(newTD1);
        var newTD2 = document.createElement("td");
        newTD2.innerHTML = '<p id="Name1">' + Name + '</p><a href="javascript:Aendern()"></a>';
        newTR.appendChild(newTD2);
        var newTD3 = document.createElement("td");
        newTD3.innerHTML = '<p id="Kategorie1">' + Kategorie + '</p><a href="javascript:Aendern()"></a>';
        newTR.appendChild(newTD3);
        var newTD4 = document.createElement("td");
        newTD4.innerHTML = '<p id="Stueck1">' + Stueck + '</p><a href="javascript:Aendern()"></a>';
        newTR.appendChild(newTD4);
        var newTD5 = document.createElement("td");
        newTD5.innerHTML = '<p id="Kurs1">' + Kurs + '</p><a href="javascript:Aendern()"></a>';
        newTR.appendChild(newTD5);
        var newTD6 = document.createElement("td");
        newTD6.innerHTML = '<p id="Gesamtwert1">' + Gesamtwert + '</p><a href="javascript:Aendern()"></a>';
        newTR.appendChild(newTD6);
        var newTD7 = document.createElement("td");
        newTD7.innerHTML = '<p id="Aktion1">' + Aktion + '</p><a href="javascript:Aendern()"></a>';
        newTR.appendChild(newTD7);
        document.forms[0].reset();
        }

oder sind diese ganzen trs noch im array? nein oder?

43 Jörg Kruse

oder sind diese ganzen trs noch im array? nein oder?

Sie sollten schon noch drin sein:

Unsortiert = new Array();
		for (var i = 0; i <= Anzahl; i++;) {
			Unsortiert[i] = new Array();
			Unsortiert[i]['Inhalt'] = document.getElementById("Tabelle2").childNodes[i];
			Unsortiert[i]['Wert'] = document.getElementById("Tabelle2").childNodes[i].childNodes[Spalte].innerHTML;
		}

44 Jerry02

hm...aber wenn ich das so mache:

		for (var i = 0; i < Anzahl; i++) {
		document.getElementById("Tabelle2").appendChild(Unsortiert);
		}

dann erscheint:

Node cannot be inserted at the specified point in the hierarchy" code: "3

Das wäre wahrscheinlich zu einfach das einfach dranzuhängen oder?

45 Jörg Kruse

Du musst das betreffende Array-Element dranhängen:

		for (var i = 0; i < Anzahl; i++) {
		document.getElementById("Tabelle2").appendChild(Unsortiert[i]['Inhalt']);
		}

es ist einfach unglaublich! sie sagen mir etwas und es funktioniert!
die sortierung umkehren kann man mir reverse() oder?
weil ich würde das noch gerne machen, dass sich die sortierung umkehrt wenn man nochmal auf den zu sortierenden wert klickt!?
nur wo muss ich dann den befehl Unsortiert.reverse() einfügen?

47 Jerry02

da muss ich einen if-befehl machen oder?
nagut vielen dank für ihre hilfe heute! das ist mir wirklich super viel wert!
ich mach erstmal schluss für heute!
gute nacht!

48 Jerry02

hm...das ist äußerst komisch! die namen sortiert es irgendwie total falsch bzw. manchmal garnicht! ist da was im suchalgorithmus falsch, weil manchmal wurden auch die zahlen nicht komplett richtig geordnet!?

49 Jerry02

ok fehler gefunden, warum es die buchstaben nicht sortiert hat! jetzt werden nur noch die zahlen irgendwie nicht vollständig richtig sortiert! wenn ich es aufsteigend sortieren möchte, dann wird trotzdem die größte zahl an den anfang gestellt und es fängt erst ab der 2. zeile an aufsteigen zu sortieren also mit der kleinsten zahl!

könntest du das vielleicht nochmal ausprobieren vielleicht weist du an was das liegt! hier nochmal der neue code! nicht erschrecken ich hab in jede spalte des headers kleine auf und ab pfeile integriert, die du ja nicht sehen kannst aber die links für die sortierungen müsste ja trotzdem gehen!
ich habe herausgefunden, dass diese probleme meistens auftreten, wenn ich nach der sortierung wieder eine zahl hinzufüge! vielleicht liegts daran!?

<html>
<head>
<title>Portfolio Management System</title>


<script type="text/javascript">


function Aendern ()
    {
        var newDate = new Date();
        var timestamp = newDate.getTime();
        var WKN = document.getElementById('WKN').value;
        var Kurs = document.getElementById('Kurs').value;
        var Name = document.getElementById('Name').value;
        var Stueck = document.getElementById('Stueck').value;
        var Kategorie = document.getElementById('Kategorie').value;
        var Gesamtwert = Stueck*Kurs;
        var Aktion = '<a href="javascript:Kursaendern(' + timestamp + ')">Kurs ändern</a>  <a href="javascript:Anzahlaendern(' + timestamp + ')">Anzahl ändern</a>  <a href="javascript:loeschen(' + timestamp + ')">löschen</a>';
        var newTR = document.createElement("tr");
        document.getElementById("Tabelle2").appendChild(newTR);
        document.getElementById("Tabelle2").lastChild.id="tr" + timestamp;
        var newTD1 = document.createElement("td");
        newTD1.innerHTML = '<p id="WKN1">' + WKN + '</p><a href="javascript:Aendern()"></a>';
        newTR.appendChild(newTD1);
        var newTD2 = document.createElement("td");
        newTD2.innerHTML = '<p id="Name1">' + Name + '</p><a href="javascript:Aendern()"></a>';
        newTR.appendChild(newTD2);
        var newTD3 = document.createElement("td");
        newTD3.innerHTML = '<p id="Kategorie1">' + Kategorie + '</p><a href="javascript:Aendern()"></a>';
        newTR.appendChild(newTD3);
        var newTD4 = document.createElement("td");
        newTD4.innerHTML = '<p id="Stueck1">' + Stueck + '</p><a href="javascript:Aendern()"></a>';
        newTR.appendChild(newTD4);
        var newTD5 = document.createElement("td");
        newTD5.innerHTML = '<p id="Kurs1">' + Kurs + '</p><a href="javascript:Aendern()"></a>';
        newTR.appendChild(newTD5);
        var newTD6 = document.createElement("td");
        newTD6.innerHTML = '<p id="Gesamtwert1">' + Gesamtwert + '</p><a href="javascript:Aendern()"></a>';
        newTR.appendChild(newTD6);
        var newTD7 = document.createElement("td");
        newTD7.innerHTML = '<p id="Aktion1">' + Aktion + '</p><a href="javascript:Aendern()"></a>';
        newTR.appendChild(newTD7);
        document.forms[0].reset();
        }

   
function Kursaendern (rowid)
    {
        var Kursaendern = prompt ("Geben Sie bitte den neuen Kurs ein.", "");
        var Kaendern = document.getElementById("tr" + rowid).childNodes[4];
        Kaendern.innerHTML = '<p id="Kurs1">' + Kursaendern + '</p><a href="javascript:Kursaendern(rowid)"></a>';
        var ZelleStueck = document.getElementById("tr" + rowid).childNodes[3].firstChild.innerHTML;
        var kGesamtwert = Kursaendern*ZelleStueck;
        var KUGesamtwert = document.getElementById("tr" + rowid).childNodes[5];
        KUGesamtwert.innerHTML = '<p id="Gesamtwert1">' + kGesamtwert + '</p><a href="javascript:Kursaendern(rowid)"></a>';
    }

function Anzahlaendern (rowid)
    {
        var Anzahlaendern = prompt ("Hier die neue Anzahl eingeben.", "");
        var AZaendern = document.getElementById("tr" + rowid).childNodes[3];
        AZaendern.innerHTML = '<p id="Stueck1">' + Anzahlaendern + '</p><a href="javascript:Anzahlaendern(rowid)"></a>';
        var ZelleKurs = document.getElementById("tr" + rowid).childNodes[4].firstChild.innerHTML;
        var aGesamtwert = ZelleKurs*Anzahlaendern;
        var AZGesamtwert = document.getElementById("tr" + rowid).childNodes[5];
        AZGesamtwert.innerHTML = '<p id="Gesamtwert1">' + aGesamtwert + '</p><a href="javascript:Anzahlaendern(rowid)"></a>';
    }
   
function loeschen (rowid)
   
    {
        var Loeschen = document.getElementById("tr" + rowid);
        document.getElementById("Tabelle2").removeChild(Loeschen);
    }

       
function Sortierung(a, b)
        {
            var tmp1 = parseInt( a['Wert'] );
			var tmp2 = parseInt( b['Wert'] );
			return tmp1 > tmp2 ? 1 :
            tmp1 < tmp2 ? -1 :
			a['Wert'] > b['Wert'] ? 1 :
			a['Wert'] < b['Wert'] ? -1 :
            0;
        }

       
function TabelleaufSortieren (Spalte)

    {
        var Anzahl = document.getElementById("Tabelle2").childNodes.length;
        Unsortiert = new Array();
        for (i = 0; i < Anzahl; i++) {
            Unsortiert[i] = new Array();
            Unsortiert[i]['Inhalt'] = document.getElementById("Tabelle2").childNodes[i];
            Unsortiert[i]['Wert'] = document.getElementById("Tabelle2").childNodes[i].childNodes[Spalte].innerHTML;
        }
        Unsortiert.sort(Sortierung);
       
        for (var i = 0; i < Anzahl; i++) {
        var Zeilenloeschen = document.getElementById("Tabelle2").childNodes[0];
            document.getElementById("Tabelle2").removeChild(Zeilenloeschen);
        }
        for (var i = 0; i < Anzahl; i++) {
        document.getElementById("Tabelle2").appendChild(Unsortiert[i]['Inhalt']);
        }
    }
    
function TabelleabSortieren (Spalte)

    {
        var Anzahl = document.getElementById("Tabelle2").childNodes.length;
        Unsortiert = new Array();
        for (i = 0; i < Anzahl; i++) {
            Unsortiert[i] = new Array();
            Unsortiert[i]['Inhalt'] = document.getElementById("Tabelle2").childNodes[i];
            Unsortiert[i]['Wert'] = document.getElementById("Tabelle2").childNodes[i].childNodes[Spalte].innerHTML;
        }
        Unsortiert.sort(Sortierung);
        Unsortiert.reverse();
       
        for (var i = 0; i < Anzahl; i++) {
        var Zeilenloeschen = document.getElementById("Tabelle2").childNodes[0];
            document.getElementById("Tabelle2").removeChild(Zeilenloeschen);
        }
        for (var i = 0; i < Anzahl; i++) {
        document.getElementById("Tabelle2").appendChild(Unsortiert[i]['Inhalt']);
        }
    }
</script>

</head>
<body>


<h1>Portfolio Management System</h1>

<form name="Maske">
    <table id="Tabelle1" border="0" cellpadding="0" cellspacing="4">
        <tr>
            <th align="right">WKN:</th>
            <th><input name="WKN" type="text" size="30" maxlenth="30" id="WKN"></th>
            <th align="right">Kurs:</th>
            <th><input name="Kurs" type="text" size="30" maxlenth="30" id="Kurs"></th>
            <th align="left">Euro</th>
        </tr>
        <tr>
            <th align="right">Name:</th>
            <th><input name="Name" type="text" size="30" maxlenth="30" id="Name"></th>
            <th align="right">Stück:</th>
            <th><input name="Stueck" type="text" size="30" maxlenth="30" id="Stueck"></th>
        </tr>
        <tr>
            <th align="right">Kategorie:</th>
            <th><input name="Kategorie" type="text" size="30" maxlenth="30" id="Kategorie"></th>
            <th><input type="button" tabindex="2" value="hinzufügen" onClick="Aendern ();"></th>
        </tr>
    </table>
</form>
<br>
<br>
<br>
<table border="1">
    <thead><tr>
        <td>WKN<a href="#" onclick="TabelleaufSortieren(0)"><font color="black"><img src="normal_auf.gif"></a><a href="#" onclick="TabelleabSortieren(0)"><font color="black"><img src="normal_ab.gif"></a></td>
        <td>Name<a href="#" onclick="TabelleaufSortieren(1)"><font color="black"><img src="normal_auf.gif"></a><a href="#" onclick="TabelleabSortieren(1)"><font color="black"><img src="normal_ab.gif"></a></td>
        <td>Kategorie<a href="#" onclick="TabelleaufSortieren(2)"><font color="black"><img src="normal_auf.gif"></a><a href="#" onclick="TabelleabSortieren(2)"><font color="black"><img src="normal_ab.gif"></a></td>
        <td>Anzahl<a href="#" onclick="TabelleaufSortieren(3)"><font color="black"><img src="normal_auf.gif"></a><a href="#" onclick="TabelleabSortieren(3)"><font color="black"><img src="normal_ab.gif"></a></td>
        <td>Kurs<a href="#" onclick="TabelleaufSortieren(4)"><font color="black"><img src="normal_auf.gif"></a><a href="#" onclick="TabelleabSortieren(4)"><font color="black"><img src="normal_ab.gif"></a></td>
        <td>Gesamtwert<a href="#" onclick="TabelleaufSortieren(5)"><font color="black"><img src="normal_auf.gif"></a><a href="#" onclick="TabelleabSortieren(5)"><font color="black"><img src="normal_ab.gif"></a></td>
        <td>Aktion</td>
    </tr></thead>
<tbody id="Tabelle2"></tbody></table>
<br>
<br>
<br>



</body>
</html>

50 Jerry02

ok das ist ja nicht so schlimm wenigstens sortiert das programm ansatzweise und das gut bis auf ein, zwei macken :)
so jetzt wollte ich noch den größten wert und den kleinsten wert unter der tabelle mittels einer funktion ausgeben und hab mir gedacht, dass man das ja wie eine sortierfunktion der arrays behandeln kann und dann am ende eben nur den bestimmten wert also in diesem falle die erste zelle in der 6. spalte also quasi den gesamtwert der zeile ausgeben kann, wenn es absteigend sortiert ist! das wäre doch theoretisch so machbar oder?

hier mal der code:

function groessterWert (Spalte)

    {
        var Anzahl = document.getElementById("Tabelle2").childNodes.length;
        Unsortiert = new Array();
        for (i = 0; i < Anzahl; i++) {
            Unsortiert[i] = new Array();
            Unsortiert[i]['Inhalt'] = document.getElementById("Tabelle2").childNodes[i];
            Unsortiert[i]['Wert'] = document.getElementById("Tabelle2").childNodes[i].childNodes[Spalte].innerHTML;
        }
        Unsortiert.sort(Sortierung);
        Unsortiert.reverse();
		var groessterName = Unsortiert[0][1];
		var groessterGesamtwert = Unsortiert[0][5]
        alert (Größte Position: + groessterName + "mit" + groessterGesamtwert +);
        }
    }

ich wollt halt erstmal, dass es mir mit einem klick auf einen link ein alert fenster aufwirft mit der info! aber im moment steht immernoch da im firebug: groessterWert is not defined
hm...

PS: ich nerv dich auch nur noch bis morgen :) dann bist du mich los!

Seite 1 2 3 456 7 8

nach oben weiter >

Verwandte Themen
Thema	Autor	Forum	Beiträge	Letzter Beitrag
Lohnt sich ein XAMPP-Update?	Ranma	Webserver und .htaccess	13	27.05.2016 14:19
Doppelte Einträge in normalisierte Datenbanktabellen vermeiden	Ranma	PHP und MySQL	5	11.05.2016 01:50
Passenden Hoster finden	Ranma	Sonstiges	33	01.04.2016 02:30
Normalisierung von Datenbanktabellen	Ranma	PHP und MySQL	63	04.01.2016 01:53
Textdatei nach Datum (erstes Feld) sortieren	webuser	PHP und MySQL	6	19.01.2014 16:08
Neue Tabellenzeile per Klick einfügen	Jerry02	JavaScript	44	24.08.2010 11:10
DB-Datensätze sortieren	AndiN	PHP und MySQL	6	21.01.2009 14:32

Tabelle sortieren [5]

Verwandte Themen