Mehrerer Dimensionen im Array
bernhard.s
- javascript
Hallo zusammen,
in meinem Script möchte ich ein Array mit drei Dimensionen aufbauen die erste steht fest, als Bsp.: meinArray(4), dahinter soll eine "zweite" Dimension angehängt werden, aber mit dem Vorgemerkt, dass die Länge der Dimension größer ist als der erste Dimension, dh. dort könnte 6, 10, 23 Elemente sein und für die zweit Dimension soll man noch Wert eingeben können. Bsp. des Arrays:
meinArry([0][0]["Wert für die zweit Dimension"]);
meinArry([0][8]["Wert für die zweit Dimension"]);
...
meinArry([2][14]["Wert für die zweit Dimension"]);
Geht das überhaupt so wie ich mir das vorstelle? Kann mir jemand in diese Angelegenheit weite helfen, wie man so ein Array in JS aufbaut.
Danke im Voraus.
Grüße Bernhard
Hallo Bernhard,
Kann mir jemand in diese Angelegenheit weite helfen, wie man so ein Array in JS aufbaut.
Du fängst an mit einem eindimensionalen Array:
var meinArray = new Array(4);
Jedem Element kannst Du ein weiteres Array zuweisen:
meinArray[0] = new Array[3];
meinArray[1] = new Array[31];
meinArray[2] = new Array[7];
meinArray[3] = new Array[15];
Auf einen Wert greifst Du jetzt mit
var x = meinArray[0][2];
meinArray[1][27] = "Wert";
zu.
Damit Du das Ganze in einer Schleife verarbeiten kannst, sollten die Arrays der zweiten Dimension allerdings besser dieselbe Größe haben:
meinArray[0] = new Array[3];
meinArray[1] = new Array[3];
meinArray[2] = new Array[3];
meinArray[3] = new Array[3];
Auch mehr Dimensionen sind denkbar:
meinArray[1][2] = new Array[8]
...
Grüße
Andreas
Hallo Namenskollege,
Damit Du das Ganze in einer Schleife verarbeiten kannst, sollten die Arrays der zweiten Dimension allerdings besser dieselbe Größe haben:
wiso? :
for(i=0; i<meinArray.length; i++)
{
for(j=0; j<meinArray[i].length; j++)
{
...hier könnte Ihr Arrayzugriff stehen ;)
}
}
Grüße
Andreas
ja, auchso
Hallo Andreas,
wiso? :
for(i=0; i<meinArray.length; i++)
{
for(j=0; j<meinArray[i].length; j++)
{
...hier könnte Ihr Arrayzugriff stehen ;)
}
}
In den meisten Fällen gebe ich Dir Recht. Ich hatte allerdings an etwas komplexere Datenstrukturen gedacht, z.B. sowas (nun gut, so komplex ist es auch wieder nicht):
var buecher = new Array();
buecher[0] = new Array();
buecher[0][0] = isbn;
buecher[0][1] = autor;
buecher[0][2] = titel;
...
Da ist es von Vorteil, wenn die Arrays nicht nur die gleiche Länge haben, sondern an der gleichen Stelle Werte des gleichen Typs stehen, so dass z.B. Formularüberprüfungen in einer Schleife abgewickelt werden können.
Grüße
Andreas
gruss Andreas Schneider, hi bernhard.s,
In den meisten Fällen gebe ich Dir Recht. Ich hatte allerdings an
etwas komplexere Datenstrukturen gedacht, z.B. sowas (nun gut, so
komplex ist es auch wieder nicht):var buecher = new Array();
buecher[0] = new Array();
buecher[0][0] = isbn;
buecher[0][1] = autor;
buecher[0][2] = titel;
...Da ist es von Vorteil, wenn die Arrays nicht nur die gleiche
Länge haben, sondern an der gleichen Stelle Werte des gleichen
Typs stehen, so dass z.B. Formularüberprüfungen in einer Schleife
abgewickelt werden können.
wenn irgendwann mal aenderungen an der daten-struktur noetig
sind, muessen die indizes auch fuer den pruef-algorithmus an-
gepasst werden;
einfacher ist es, komplexe strukturen, wie Deine beispielhaft
angefuehrte, in assoziativen arrays abzubilden, wenn es denn
unbedingt arrays sein muessen - vorzuziehen waeren hier jedoch
"reine" objekte (keine arrayeigenschaften);
falls objekte gleicher struktur zusammengafsst werden muessen,
bietet sich dann wieder ein "reines" array (nur indizes,keine
keywords) an;
var bookSequence = [
{isbn:"1-2345-6789-0", author:"whoever", title:"whatever"},
{isbn:"2-3456-7890-1", author:"noclue", title:"idonotknow"},
//{...},
//{...},
{isbn:"7-8901-2345-6", author:"jack", title:"stilldontknow"}
];
dies ist das array "bookSequence" mit zur zeit drei identisch
aufgebauten objekten unterschiedlichen inhalts ausgefuehrt in
platzsparender und uebersichtlicher array-literal- und objekt-
literal-schreibweise;
auch wesentlich komplexere datenstrukturen mit allen nur
erdenklichen kombinationen aus object-array bzw array-object
lassen sich auf diesem wege noch "human-readable" gestalten
und damit auch pflegen bzw. serverseitig als ".js-datenbank"
generieren;
by(t)e by(t)e - peterS. - pseliger@gmx.net
--
sh:| fo:) ch:? rl:| br:& n3:} n4:# ie:| mo:{ va:| de:[ zu:] fl:) ss:) ls:& js:)
Hallo Peter,
Ich gebe zu, mein Beispiel war nicht wirklich glücklich gewählt. Da mir kein besseres einfällt, streichen wir am Besten einfach den Satz "Damit Du das Ganze in einer Schleife verarbeiten kannst, sollten die Arrays der zweiten Dimension allerdings besser dieselbe Größe haben" aus meinem ersten Posting. Es ist wohl tatsächlich so nicht notwendig.
Grüße
Andreas
Hallo Andreas Schneider, Andreas-Lindig und Peter,
erst Mal danke für Eure Erklärung. Zur meinem Problem, den Vorschlag, den Andreas Schneider unterbreitet hat ist für mein Problem eine gut Lösung, jedoch der Beitrag, den Peter geschrieben hat bei mir ein großes Interesse geweckt. Diese Aufgabe nur mit Objekten zu lösen, es müssen nicht unbedingt Array sein, es geht mir nur einfach um eine schnelle und möglichst unkomplizierte Lösung.
Hier noch ein kurze Vorgeschichte zur meine Frage, auf eine Seite habe folgende Angebe, eine "Liste von Seiten" die in Form von Button dargestellt werden, die ich mit r1 bezeichne, eine "zweit Liste", die ich r2 nenne hat, bzw. darstellet eine Menge(Anzahl) von Punkten, die auf eine Seite vorkommen, als Bsp.: In eine Zeitungsbeilage existieren vier Seiten auf der Seite eins sind acht Punkte auf der Seite zwei sind es achtzehn Punkte usw. dazu gibt es noch eine "dritte Liste" mit Elementen, dh. zum jeden Punkt für die zweit Liste kann der User ein Element auswählen. Zur meinem gestrigen Bsp.:
meinArry([1][2]["Wert für die zweit Dimension"]);
1 - Seitenzahl
2 - Punktzahl
"Wert für die zweit Dimension" - Element, den der User gewählt hat.
Das war die Theorie, jetzt zur Praxis, ich habe eine Funktion werte(), die bekommt den aktuellen Elementnummer, die Seite und der grade angewählte Punkt bekomme ich über das Formular, ab hier die Funktion:
...
var position_punkt = new Array(4); // Die vier soll für die Seitezahl stehen.
function werte(element){
var punkt = document.form1.punkt_position.value;
var seite = document.form1.gewaehlte_seite.value;
for(var i=0; i<position_punkt.length; i++){
if(seite == i){
position_punkt[i] = new Array(punkt);
}
}
}
...
Die Seit wird jedes Mal Überschrieben, und außer dem möchte ich für jede Seite alle Punkte auf der Seite sammeln. Jergend wie habe ich ein grundsätzliche Verständnis Problem mit Arrays bei JavaScript :-(((
Wenn ich folgendes versuche:
position_punkt[i][1] = new Array(punkt);
position_punkt[1][i] = new Array(punkt);
In Beiden Fällen bekomme ich Fehler :-( Die Alternative ist:
position_punkt[i] = punkt;
was eigentlich keine Alternative ist :-(
Noch etwas zum Peters Beitrag über Objekte, wie würde "das Aussehen"? Dazu habe ich kein Idee :-(
Grüße Bernhard
ernhard,
Das war die Theorie, jetzt zur Praxis, ich habe eine Funktion werte(), die bekommt den aktuellen Elementnummer, die Seite und der grade angewählte Punkt bekomme ich über das Formular, ab hier die Funktion:
Das kann man sehr schön mit einem zweidimensionalen Array lösen:
var seiten = new Array(seitenanzahl);
seiten[0] = new Array(punktanzahl_auf_seite_1]; // Javascript fängt bei 0 zu zählen an!
seiten[1] = new Array(punktanzahl_auf_seite_2];
seiten[2] = new Array(punktanzahl_auf_seite_3];
...
Dann muß noch jedem Punkt auf jeder Seite sein Wert zugewiesen werden:
seiten[1][3] = "Wert für Punkt 4 auf Seite 2";
usw.
So, jetzt hast Du eine vollständige Liste aller Punkte auf allen Seiten. Machen wir weiter mit dem Zugriff auf die einzelnen Punkte:
var punkt = document.form1.punkt_position.value;
var seite = document.form1.gewaehlte_seite.value;
derWert = seiten[seite][punkt];
Mit diesem Wert kannst Du jetzt weiterarbeiten.
Jergend wie habe ich ein grundsätzliche Verständnis Problem mit Arrays bei JavaScript :-(((
Und ich bin immer noch nicht ganz sicher, ob ich Dich richtig verstanden habe.
Wenn ich folgendes versuche:
position_punkt[i][1] = new Array(punkt);
position_punkt[1][i] = new Array(punkt);
In Beiden Fällen bekomme ich Fehler :-( Die Alternative ist:
Was für Fehler?
Noch etwas zum Peters Beitrag über Objekte, wie würde "das Aussehen"? Dazu habe ich kein Idee :-(
Dazu findest Du hier http://selfhtml.teamone.de/javascript/sprache/objekte.htm#eigene mehr.
Grüße
Andreas
Hi Andres,
den zwei dimensionalen Array versuche ich so zu bauen, dh für die grade ausgewählte Seite möchte ich alle Punkte, die auf der Seite vorhandne sind in den Array seite[seiteJ] reinschreiben:
var seiten = new Array(4); // Anzahl der Seiten
function werte(element){
var punkt = document.form1.punkt_position.value; // Punkt, den der User grade ausgewählt hat
var seiteJ = document.form1.gewaehlte_seite.value; // gerade ausgewählte Seite
var punktZahl = document.form1.punkt_anzahl.value; // die Anzahl der Punkt auf eine Seite
for(var i=0; i<punktZahl; i++){
seiten[(seiteJ-1)] = new Array(i);
}
}
Leider ohne Erfolg :-( Versuche ich es mit:
seiten[(seiteJ-1)][1] = new Array(i);
bekomme ich folgende Fehlermeldung:
Zeile: ...
Zeichen: ...
Fehler: 'seiten[...]' ist Null oder kein Objekt.
Code: 0
URL: ...
Mein Gedankengang, die Variable "seite" bekommt die Anzahl der Seiten, danach lasse ich in der Funktion werte() eine for Schleife ablaufen mit der Anzahl der Punkte, die auf eine Seite existieren. Also die Seite eins hat fünf Punkt, die fünf Punkte möchte ich an die erste Stelle ins Array "seite" reinschreiben, wie ich das jetzt mache ist es eindeutig falsch :-(((( wie muss ich das machen mit ein Schleife, so dass der Array "seite" später so aussieht:
seite[0][1]
seite[0][2]
seite[0][3]
seite[0][4]
seite[0][5]
???
In Deinen Bsp:
seiten[2] = new Array(punktanzahl_auf_seite_3];
aber Du meinst so:
seiten[2] = new Array(punktanzahl_auf_seite_3);
hinten ebenfalls ein runde Klammer.
Grüße Bernhard
Hallo Bernhard,
jetzt schauen wir uns mal an, was hier passiert:
Du erzeugst ein Array, das vier Werte enthalten kann:
var seiten = new Array(4); // Anzahl der Seiten
function werte(element){
Hier liest Du drei Zahlen- (?) Werte aus einem Formular:
var punkt = document.form1.punkt_position.value; // Punkt, den der User grade ausgewählt hat
var seiteJ = document.form1.gewaehlte_seite.value; // gerade ausgewählte Seite
var punktZahl = document.form1.punkt_anzahl.value; // die Anzahl der Punkt auf eine Seite
Und jetzt wird's interessant:
for(var i=0; i<punktZahl; i++){
seiten[(seiteJ-1)] = new Array(i);
}
}
Nehmen wir der Einfachheit halber mal an, wir befinden und auf Seite 2 und diese Seite hat 3 Punkte.
Dann macht die obige Schleife folgendes:
i=0 -> Im zweiten Element des Arrays seiten (seiten[1]) wird ein neues Array mit 0 Elementen gespeichert
i=1 -> Im zweiten Element des Arrays seiten (seiten[1]) wird ein neues Array mit 1 Element gespeichert
i=2 -> Im zweiten Element des Arrays seiten (seiten[1]) wird ein neues Array mit 2 Elementen gespeichert
Ergebnis:
Das erste Element des Arrays seiten (seiten[0]) ist leer.
Das zweite Element des Arrays seiten (seiten[1]) enthält ein Array mit zwei (leeren) Elementen.
Das dritte Element des Arrays seiten (seiten[2]) ist leer.
Das vierte Element des Arrays seiten (seiten[3]) ist leer.
Leider ohne Erfolg :-( Versuche ich es mit:
seiten[(seiteJ-1)][1] = new Array(i);
Was ich immer noch nicht so ganz verstehe ist, warum Du weitere Arrays erzeugst, aber nirgendwo Werte in diesen Arrays speicherst.
Mein Gedankengang, die Variable "seite" bekommt die Anzahl der Seiten, danach lasse ich in der Funktion werte() eine for Schleife ablaufen mit der Anzahl der Punkte, die auf eine Seite existieren. Also die Seite eins hat fünf Punkt, die fünf Punkte möchte ich an die erste Stelle ins Array "seite" reinschreiben, wie ich das jetzt mache ist es eindeutig falsch :-(((( wie muss ich das machen mit ein Schleife, so dass der Array "seite" später so aussieht:
seite[0][1]
seite[0][2]
seite[0][3]
seite[0][4]
seite[0][5]
???
Ich nehme mal an, das soll seiten heissen, und nicht seite. Mit
seite[0] = new Array(punktZahl)
erreichst Du doch genau das. Allerdings ist dieses Array dann noch leer und muß mit Werten gefüllt werden.
In Deinen Bsp:
[...]
hinten ebenfalls ein runde Klammer.
Stimmt. War ein Tippfehler.
Grüße
Andreas
Hallo Andreas,
erst Mal entschuldige, dass ich am Wochenenden nicht geantwortet habe, war mir doch zu Heiß.
Hier liest Du drei Zahlen- (?) Werte aus einem Formular:
var punkt = document.form1.punkt_position.value; // Punkt, den der User grade ausgewählt hat
var seiteJ = document.form1.gewaehlte_seite.value; // gerade ausgewählte Seite
var punktZahl = document.form1.punkt_anzahl.value; // die Anzahl der Punkt auf eine Seite
Diese Werte werden schon früher gesetzt.
Was ich immer noch nicht so ganz verstehe ist, warum Du weitere Arrays erzeugst, aber nirgendwo Werte in diesen Arrays speicherst.
Wie kann ich die Werte dort die Werte speichern? An dieser Stelle habe ich ein leeren Array, was Du oben schreibst, stimme ich Dir zu.
Ich habe folgendes versucht:
var seiten = new Array(4); // Anzahl der Seiten
function werte(element){
var punkt = document.form1.punkt_position.value; // Punkt, den der User grade ausgewählt hat
var seiteJ = document.form1.gewaehlte_seite.value; // gerade ausgewählte Seite
var punktZahl = document.form1.punkt_anzahl.value; // die Anzahl der Punkt auf eine Seite
for(var i=0; i<=punktZahl; i++){
if(i==(seiteJ-1)){
seiten[(seiteJ-1)] = new Array(i);
}
}
/*
Nehmen wir der Einfachheit halber mal an, wir befinden und auf Seite 2 und diese Seite hat 3 Punkte.
Dann macht die obige Schleife folgendes:i=0 -> Im zweiten Element des Arrays seiten (seiten[1]) wird ein neues Array mit 0 Elementen gespeichert
i=1 -> Im zweiten Element des Arrays seiten (seiten[1]) wird ein neues Array mit 1 Element gespeichert
i=2 -> Im zweiten Element des Arrays seiten (seiten[1]) wird ein neues Array mit 2 Elementen gespeichert
Ergebnis:
Das erste Element des Arrays seiten (seiten[0]) ist leer.
Das zweite Element des Arrays seiten (seiten[1]) enthält ein Array mit zwei (leeren) Elementen.
Das dritte Element des Arrays seiten (seiten[2]) ist leer.
Das vierte Element des Arrays seiten (seiten[3]) ist leer.
So weit so gut, ich erstelle nur leere Arrays :-(
In der nächst Schleife möcht ich sie fühlen:
*/
for(var i=0; i<=punktZahl; i++){
if(i==(punkt-1)){
seiten[(seiteJ-1)][i] = new Array(element);
}
}
/*
In dem von User grade ausgewählten Punkt möchte ich den Elementnummer "element" speichern, leider wird er bei jedem neu gewählten Punkt überschrieben.
Was hältst Du von diese Methode?
Noch etwas, als Kontrollausgabe gebe ich die Variable "seiten" in einem alert Fenster aus und lasse die eine for Schleifen ablaufen:
*/
var aus="";
for(var i=0; i<=seiten.length; i++){
aus += seiten[0][i]+", "+seiten[i]+"\n";
}
alert(seiten+"\n\n"+aus);
}
Ich nehme mal an, das soll seiten heissen, und nicht seite. Mit
seite[0] = new Array(punktZahl)
erreichst Du doch genau das. Allerdings ist dieses Array dann noch leer und muß mit Werten gefüllt werden.
Ja, stimmt, ich habe mich eben falls vertipt.
Grüße Bernhard
Hallo Bernhard,
In der nächst Schleife möcht ich sie fühlen:
*/
for(var i=0; i<=punktZahl; i++){
Da Du bei 0 anfängst zu zählen, müsste es wohl i<punktzahl heissen.
if(i==(punkt-1)){
seiten[(seiteJ-1)][i] = new Array(element);
}
}
Auch hier erzeugst Du wieder ein neues, leeres Array, anstatt das vorhandene z.B. so
seiten[(seiteJ-1)][i] = "Wert";
mit Werten zu füllen.
Ausserdem hast Du hier eine unnötige Schleife über alle Punkte, obwohl Du nur ein einziges Arrayelement füllst.
Nehmen wir wieder an, Du hast 4 Punkte auf der Seite und punkt ist gleich 2. Dann passiert folgendes:
1. Durchlauf, i=0 -> (punkt-1) ist ungleich i, nichts passiert
2. Durchlauf, i=1 -> (punkt-1) ist gleich i, ein neues Array wird erzeugt
3. Durchlauf, i=2 -> (punkt-1) ist ungleich i, nichts passiert
4. Durchlauf, i=3 -> (punkt-1) ist ungleich i, nichts passiert
Da Du aber schon vorher weisst, auf welches Arrayelement Du zugreifen willst, kannst Du Dir die Schleife sparen und gleich schreiben:
seiten[seiteJ-1][punkt-1] = "Wert";
Die runden Klammern um seiteJ-1 sind hier übrigens nicht notwendig.
In dem von User grade ausgewählten Punkt möchte ich den Elementnummer "element" speichern, leider wird er bei jedem neu gewählten Punkt überschrieben.
Was hältst Du von diese Methode?
Es wäre vielleicht am besten, wenn Du das Ganze mal hochladen und hier verlinken würdest, damit man es sich mal ansehen kann.
Noch etwas, als Kontrollausgabe gebe ich die Variable "seiten" in einem alert Fenster aus und lasse die eine for Schleifen ablaufen:
var aus="";
for(var i=0; i<=seiten.length; i++){
Auch hier muss es wieder i<seiten.length heissen.
aus += seiten[0][i]+", "+seiten[i]+"\n";
}
alert(seiten+"\n\n"+aus);
}
Wenn Du alles ausgeben willst, brauchst Du zwei Schleifen:
for (i=0; i<seiten.length; i++) {
// seiten[i] ist wieder ein Array:
for (j=0; j<seiten[i].length; j++) {
aus += seiten[i][j] + " ";
// Das Leerzeichen dient zum Trennen der Werte
}
// Eine ausgabe pro Seite:
alert(aus);
}
Grüße
Andreas
Hallo Andreas,
danke für die Erkeleerung, jetzt weis ich wie ein Array unter JavaScript funktioniert :-)
for(var i=0; i<=punktZahl; i++){
Da Du bei 0 anfängst zu zählen, müsste es wohl i<punktzahl heissen.
Eigentlich würde ich lieber mit Eins anfangen, den eine Nullpunkt oder Element gibt es nicht.
Auch hier erzeugst Du wieder ein neues, leeres Array, anstatt das vorhandene z.B. so
seiten[(seiteJ-1)][i] = "Wert";
mit Werten zu füllen.Ausserdem hast Du hier eine unnötige Schleife über alle Punkte, obwohl Du nur ein einziges Arrayelement füllst.
Nehmen wir wieder an, Du hast 4 Punkte auf der Seite und punkt ist gleich 2. Dann passiert folgendes:
- Durchlauf, i=0 -> (punkt-1) ist ungleich i, nichts passiert
- Durchlauf, i=1 -> (punkt-1) ist gleich i, ein neues Array wird erzeugt
- Durchlauf, i=2 -> (punkt-1) ist ungleich i, nichts passiert
- Durchlauf, i=3 -> (punkt-1) ist ungleich i, nichts passiert
Da Du aber schon vorher weisst, auf welches Arrayelement Du zugreifen willst, kannst Du Dir die Schleife sparen und gleich schreiben:
Diese Erklärung hat mir gefehlt.
seiten[seiteJ-1][punkt-1] = "Wert";
Finde ich ein bessere Alternative zur einer Schleife.
Die runden Klammern um seiteJ-1 sind hier übrigens nicht notwendig.
Danke für den Tipp :-)
In dem von User grade ausgewählten Punkt möchte ich den Elementnummer "element" speichern, leider wird er bei jedem neu gewählten Punkt überschrieben.
Was hältst Du von diese Methode?Es wäre vielleicht am besten, wenn Du das Ganze mal hochladen und hier verlinken würdest, damit man es sich mal ansehen kann.
Sorry, es ist nicht möglich denn es läuft auf einem lokalem Rechner :-( Ich kann höchstens die gesamte Funktion hoch laden.
Mittlerweile habe ich die Funktion etwas umgebaut:
seiten[seiteJ][punkt] = element;
Ohne "-1" denn ich möchte nicht mit Null anfangen. an diser Stelle bekomme ich leider ein Fehlermeldung:
Zeile:89
Zeichen:4
Fehler:Objekt erwartet
Code:0
URL:...
Also es hängt mit dem Aufbau oder mit der Erweiterung des Array "seiten", also vor der Funktion definiere ich das Array "seiten" und mache eine Vorbelegung mit vier:
var seiten = new Array(4); // Anzahl der Seiten
function werte(element){
var punkt = document.form1.punkt_position.value; // Punkt, den der User grade ausgewählt hat
var seiteJ = document.form1.gewaehlte_seite.value; // gerade ausgewählte Seite
var punktZahl = document.form1.punkt_anzahl.value; // die Anzahl der Punkt auf eine Seite
In der Funktion bekomme ich die Variablen "punkt" und "seiteJ", die ich zum erweitern des Array "seiten" in der Funktion benutze:
Als Bsp.: Seite zwei, Punkt 3, Elemen 4:
seiten[2][3] = 4;
Also auf der Seit zwei erweitere das Array um die Dimension 3 und füge zur der Dimension den Wert 4
Stimmt das was ich geschrieben habe? JavaScript erlaubt eigentlich eine beliebige Erweiterung von Array für "3" konnte auch "155" stehen es sollte eingetlich kein Fehler kommen!
Grüße Bernhard
An hier die Funktion:
...
var zahl_der_artikeln = "12";
var seiten = new Array(2);
function werte(element, id_nr, wert1, wert2, wert3, wert4){
var wochen_nr = "14";
var layout_wahl = "dateiname;
if(document.artikel.dot_position.value != ""){
for(var i=1; i<=zahl_der_artikeln; i++){
if(element == i){
document.getElementById("bgc_"+element).style.backgroundColor= "#99CC33";
document.getElementById("position_nr_"+element).innerHTML = element;
} else {
document.getElementById("bgc_"+i).style.backgroundColor= "#FFFFFF";
document.getElementById("position_nr_"+i).innerHTML = "";
}
}
var punkt = document.artikel.dot_position.value; // welchen Punkt auf der linke Seite hat der User grade angeklickt
var seiteJ = document.artikel.gewaehlte_seite.value; //grade ausgewählte Seit in der Anzeigen
var gesammelte_werte = new Array(punkt, id_nr, wert1, wert2, wert3, wert4, wochen_nr, layout_wahl, zahl_der_artikeln, seiteJ);
parent.dot_content.ausgabe_content(gesammelte_werte);
parent.top.head.location.href = "oben.php?WEITER=<%=session_id()%>&tabelle_layout=ja&main_id="+id_nr+"&week="+wochen_nr+"&page="+seiteJ+"&field="+punkt+"&layout="+layout_wahl;
var punktZahl = document.artikel.punkt_anzahl.value; // Die Anzahl der Punkte auf eine Seite
/*
Ab hier ist der Array "seiten" und alles was damit hängt.
*/
/*
for(var i=0; i<=punktZahl; i++){
if(i==(seiteJ-1)){
seiten[(seiteJ-1)] = new Array(i);
}
}*/
//seiten[seiteJ-1][punkt-1] = element;
//seiten[seiteJ][punkt] = element;
/*
seiten[seiteJ][punkt] = element;
alert(seiten);
*/
/*
for(var i=0; i<punktZahl; i++){
if(i== (punkt-1)){
//seiten[(seiteJ-1)][i] = new Array(element);
seiten[(seiteJ-1)][i] = element;
}
}
*/
var aus="";
/*
for(var i=1; i<=seiten.length; i++){
aus += seiten[0][i]+", "+seiten[i]+"\n";
}*/
/*
for (var i=1; i<=seiten.length; i++)
{
//if(seiten[i].length){
for (var j=1; j<=seiten[i].length; j++)
{
//aus += seiten[i][j] + " ";
aus += i+", "+j+ " ";
// Das Leerzeichen dient zum Trennen der Werte
}
//}
}
*/
//alert(seiten.length+"\n\n"+seiten+"\n\n"+seiten[seiteJ-1][punkt-1]+"\n\n"+aus);
} else {
alert("Fehler, bitte ein Punkt wählen.");
}
}
...
<form name="artikel" action="" method="POST">
<input type="hidden" name="dot_position" value="">
<input type="hidden" name="gewaehlte_seite" value="">
<input type="hidden" name="punkt_anzahl" value="">
<table border="0" CELLSPACING="0" CELLPADDING="0" class="dot_frame_navi">
<tr>
<td colspan="3" height="30" valign="top">
<script language=JavaScript>
<!--
var SeitenZahl = 2";
for(var i=1; i<=SeitenZahl; i++){
document.write("<input type='button' id='s_"+i+"' value='"+i+"' style='width=25;'");
document.write("OnClick="seiten_zahl("+i+")">\n");
}
//-->
</script>
</td>
</tr>
<tr>
<td colspan="3" height="10" valign="center">
<div style="width:100%; height:0; left:0; background-color:#000000;"><IMG SRC="../images/pixel.GIF" BORDER="0" width="2" height="1"></div>
</td>
</tr>
<tr>
<td rowspan="12>" valign="top">
<?
for($i=1; $i<=12; $i++){
ECHO "\t<input type='button' id='b_".$i."' name='".$i."' value='".$i."' style="width=25;" OnClick="button_farbe('".$i."');"><br>\n";
}
?>
</td>
<td rowspan="<%=count($row_main)%>"> </td>
<td>
<?
...
Hallo Bernhard,
Da Du bei 0 anfängst zu zählen, müsste es wohl i<punktzahl heissen.
Eigentlich würde ich lieber mit Eins anfangen, den eine Nullpunkt oder Element gibt es nicht.
Javascript fängt bei 0 an zu zählen, d.h. das erste Arrayelement ist _immer_ seiten[0]. Aber Du kannst natürlich auch die Schleife bei 1 anfangen lassen und musst dafür beim Arrayindex eins abziehen, um die die Elemente mit Index 0 bis Anzahl-1 anzusprechen. Letztendlich ist es egal, Hauptsache die _Anzahl_ der Arrayelemente stimmt.
seiten[seiteJ-1][punkt-1] = "Wert";
Finde ich ein bessere Alternative zur einer Schleife.
Nun, ja, warum eine Schleife durchlaufen, wenn man nur auf ein einziges Arrayelement zugreifen will.
Mittlerweile habe ich die Funktion etwas umgebaut:
seiten[seiteJ][punkt] = element;
Ohne "-1" denn ich möchte nicht mit Null anfangen. an diser Stelle bekomme ich leider ein Fehlermeldung:
Zeile:89
Zeichen:4
Fehler:Objekt erwartet
Was steht denn in Zeile 89? Ein Zugriff auf ein Arrayelement, dessen Index größer oder gleich der Anzahl der Arrayelemente ist?
Als Bsp.: Seite zwei, Punkt 3, Elemen 4:
seiten[2][3] = 4;
Also auf der Seit zwei erweitere das Array um die Dimension 3 und füge zur der Dimension den Wert 4
Ist denn seiten[2] ein Array?
An hier die Funktion:
Ok, sehen wir sie uns mal an.
...
var zahl_der_artikeln = "12";
var seiten = new Array(2);
function werte(element, id_nr, wert1, wert2, wert3, wert4){var wochen_nr = "14";
Ist das keine Zahl? Wenn doch: Anführungszeichen sind zuviel.
var layout_wahl = "dateiname;
Hier fehlt das schliessende Anführungszeichen.
[...]
var punkt = document.artikel.dot_position.value; // welchen Punkt auf der linke Seite hat der User grade angeklickt
var seiteJ = document.artikel.gewaehlte_seite.value; //grade ausgewählte Seit in der Anzeigen
var punktZahl = document.artikel.punkt_anzahl.value; // Die Anzahl der Punkte auf eine SeiteAb hier ist der Array "seiten" und alles was damit hängt.
Dann nehmen wir doch zuerst mal die Kommentare raus:
// Ab hier ist der Array "seiten" und alles was damit hängt.
for(var i=0; i<=punktZahl; i++){
if(i==(seiteJ-1)){
seiten[(seiteJ-1)] = new Array(i);
}
}
Du brauchst keine Schleife, wenn Du schon vorher den Index des Elements kennst, auf das Du zugreifen willst.
//seiten[seiteJ-1][punkt-1] = element;
//seiten[seiteJ][punkt] = element;
seiten[seiteJ][punkt] = element;
Da Du bei 1, Javascript aber bei 0 anfängt zu zählen, ist die erste Zeile richtig.
alert(seiten);
for(var i=0; i<punktZahl; i++){
if(i== (punkt-1)){
//seiten[(seiteJ-1)][i] = new Array(element);
seiten[(seiteJ-1)][i] = element;
}
}
s.o.
[...]
<form name="artikel" action="" method="POST">
<script language=JavaScript>
Das sollte besser <script type="text/javascript"> heissen.
<!--
var SeitenZahl = 2";
Das öffnende Anführungszeichen fehlt.
for(var i=1; i<=SeitenZahl; i++){
document.write("<input type='button' id='s_"+i+"' value='"+i+"' style='width=25;'");
document.write("OnClick="seiten_zahl("+i+")">\n");
}
//-->
</script>
Warum machst Du das mit Javascript und nicht wie unten mit PHP?
<?
for($i=1; $i<=12; $i++){
ECHO "\t<input type='button' id='b_".$i."' name='".$i."' value='".$i."' style="width=25;" OnClick="button_farbe('".$i."');"><br>\n";
}
?>
...
Ich bin ehrlich gesagt nicht so ganz sicher, was Du eigentlich bezweckst. Wenn ich den PHP-Teil durch Buttons ersetze, dann sehe ich mehrere Reihen mit Zahlen beschrifteter Buttons. Die Funktion Werte wird allerdings durch keinen davon aufgerufen.
Schreib nochmal ganz genau auf, wann, wo und wie oft der Aufruf erfolgt und was die Funktion genau machen soll, vielleicht kommen wir dann ja weiter.
Grüße
Andreas
Hallo Andreas,
dies Mal fange ich von unter an Dein Forumbeitrag zu beantworten.
Schreib nochmal ganz genau auf, wann, wo und wie oft der Aufruf erfolgt und was die Funktion genau machen soll, vielleicht kommen wir dann ja weiter.
Also, erst Mal muss ich mich entschuldigen, gestern habe ich ein Teil vom Code vergessen, es handelt sich um die Elementesliste, ich werde es heute vervollständigen. Wie Du aus dem Code entnehmen kannst, ist oben ein Reihe von Button (ich nenne sie hier r1), die Angaben über die Seitenzahl und Links eine Reihe (ich nenne sie hier r2) von Button, die Anzahl der Punkte auf eine Seite, eine dritte Reihe (ich nenne sie hier r3) ist darunter, die Elementliste. Wird die Seite aufgerufen bekommt der User die drei "Reihen", oben die Seiten (r1), links die Punkte (r2), in der "mitte" die Elementliste (r3). Nach dem laden der Seit ist "vorgewählt" ist die Seite eins, jetzt muss der User erst ein Punkt (r2) auf der linke Seite wählen, zu jedem Punkt(r2) kann er User ein Element aus der Elementlist (r3) in der "mitte" wählen. Hat der User ein Elelment(r3) gewählt soll die Seitenummer dahinter erscheine. Jetzt am konkretem Bsp. Auf der Seite 1 wählt der User in der Linke Buttonreihen(r2) ein Punkt als Bsp.: 3 aus danach wählt er ein Element aus der Elementenliste(r3) aus als Bsp.:8 aus, sobald er darauf auf den achten Element geklickt hat soll die grade ausgewählte Seitennummer dahinter stehen also die 1. Mein Gedanke war sich alle Punkt aus der Reihe r2 und alle Elementenummern r3 aus der Elementenliste zu sammeln. in einem Array, der sollte ungefähr so aussehen. seiten[1][3][8] Sofort nach dem Aufbau sollte dieser Array auch ausgegeben werden.
Ich hoffe Du hast es mich verstanden worum es mir geht. Jetzt zur weitern Punkten, die Du angesprochen hast.
Ich bin ehrlich gesagt nicht so ganz sicher, was Du eigentlich bezweckst. Wenn ich den PHP-Teil durch Buttons ersetze, dann sehe ich mehrere Reihen mit Zahlen beschrifteter Buttons. Die Funktion Werte wird allerdings durch keinen davon aufgerufen.
Sorry, wieder mein Fehler, ich habe gestern zur wenig gepostet. Zum PHP Teil, ja stimmt, eigentlich an dieser Steller macht das kein unterschied mehr.
<form name="artikel" action="" method="POST"> <script language=JavaScript>
Das sollte besser <script type="text/javascript"> heissen.
Danke für den Tipp.
Einige Variabelennamen sind vielleicht bissen unglücklich ausgewählt, es kann sein, dass die Namen nicht eindeutig sind :-( Die anderen Sachen, die Du angesprochen hast, habe ich weggelassen. jetzt hast Du kompletten Überblick über allen Funktionen.
Grüße Bernhard
Ab hier wider die Funktion: ... var punkte_zahl = new Array(4); var zahl_der_artikeln = "12"; var seiten = new Array(2); function werte(element, id_nr, wert1, wert2, wert3, wert4){
var wochen_nr = 14; var layout_wahl = "dateiname"; // vertipt
if(document.artikel.dot_position.value != ""){
for(var i=1; i<=zahl_der_artikeln; i++){ if(element == i){ document.getElementById("bgc_"+element).style.backgroundColor= "#99CC33"; document.getElementById("position_nr_"+element).innerHTML = element; } else { document.getElementById("bgc_"+i).style.backgroundColor= "#FFFFFF"; document.getElementById("position_nr_"+i).innerHTML = ""; } }
var punkt = document.artikel.dot_position.value; // welchen Punkt auf der linke Seite hat der User grade angeklickt var seiteJ = document.artikel.gewaehlte_seite.value; //grade ausgewählte Seit in der Anzeigen
var gesammelte_werte = new Array(punkt, id_nr, wert1, wert2, wert3, wert4, wochen_nr, layout_wahl, zahl_der_artikeln, seiteJ); parent.dot_content.ausgabe_content(gesammelte_werte);
parent.top.head.location.href = "../htm/head.php?WEITER=<%=session_id()%>&tabelle_layout=ja&main_id="+id_nr+"&week="+wochen_nr+"&page="+seiteJ+"&field="+punkt+"&layout="+layout_wahl; var punktZahl = document.artikel.punkt_anzahl.value; // Die Anzahl der Punkte auf eine Seite
/* Ab hier ist der Array "seiten" und alles was damit hängt. */
seiten[seiteJ][punkt] = element; // Zeile 79 alert(seiten); /* Das habe ich heute geendert und es kommt folgenden Fehlermeldung: Zeile:79 Zeichen:3 Fehler:Objekt erwartet Code:0 URL: Serverdateipfad / / for(var i=0; i<=punktZahl; i++){ if(i==(seiteJ-1)){ seiten[(seiteJ-1)] = new Array(i); } }/ //seiten[seiteJ-1][punkt-1] = element; //seiten[seiteJ][punkt] = element; / for(var i=0; i<punktZahl; i++){ if(i== (punkt-1)){ //seiten[(seiteJ-1)][i] = new Array(element); seiten[(seiteJ-1)][i] = element; } } / var aus=""; / for(var i=1; i<=seiten.length; i++){ aus += seiten[0][i]+", "+seiten[i]+"\n"; }/ / for (var i=1; i<=seiten.length; i++) { //if(seiten[i].length){ for (var j=1; j<=seiten[i].length; j++) { //aus += seiten[i][j] + " "; aus += i+", "+j+ " "; // Das Leerzeichen dient zum Trennen der Werte } //} } */ //alert(seiten.length+"\n\n"+seiten+"\n\n"+seiten[seiteJ-1][punkt-1]+"\n\n"+aus);
} else { alert("Fehler, bitte wählen Sie zurerst auf der linke Seite ein Punkt aus."); } } function seiten_zahl(seite_nr){
var wert_punkte = 0; for(var i=1; i<=punkte_zahl.length; i++){ if(i == seite_nr){ wert_punkte = punkte_zahl[(i-1)]; document.getElementById("s_"+i).style.backgroundColor= "#BDE7FF"; } else { document.getElementById("s_"+i).style.backgroundColor= "#CCCCCC"; } } if(wert_punkte == 0){ wert_punkte = punkte_zahl[0]; }
if(seite_nr){ document.artikel.gewaehlte_seite.value = seite_nr; document.artikel.punkt_anzahl.value = wert_punkte; } else { document.artikel.gewaehlte_seite.value = 1; document.artikel.punkt_anzahl.value = wert_punkte; }
punkte_aufbau(wert_punkte); }
function punkte_aufbau(wert_punkte_nr){
/* Die Variabel -auschalten- ist zuständig für das zurücksetzten alle Werte auf die Ausgangpositon beim wechseln zwischen den Seiten. */ var ausschalten = 0; for(var i=1; i<=4; i++){ // i<=4; nur Bsp. Wert if(i == wert_punkte_nr){ ausschalten = 1; document.getElementById("b_"+wert_punkte_nr).disabled=false; } else { if(i< wert_punkte_nr){ document.getElementById("b_"+i).disabled=false; } else { ausschalten = 1; document.getElementById("b_"+i).disabled=true; } } }
if(ausschalten == 1){ for(var i=1; i<=zahl_der_artikeln; i++){ document.getElementById("bgc_"+i).style.backgroundColor= "#FFFFFF"; document.getElementById("position_nr_"+i).innerHTML = ""; } for(var i=1; i<=<%=$punkt_max%>; i++){ document.getElementById("b_"+i).style.color="#000000"; document.getElementById("b_"+i).style.fontWeight="normal"; document.getElementById("b_"+i).style.backgroundColor= "#CCCCCC"; document.artikel.dot_position.value = ""; } } } function button_farbe(button_nr){
for(var i=1; i<=4; i++){ // i<=4; nur Bsp. Wert if(button_nr == i){ document.getElementById("b_"+button_nr).style.color="#000000"; document.getElementById("b_"+button_nr).style.fontWeight="bold"; document.getElementById("b_"+button_nr).style.backgroundColor= "#99CC33"; } else { document.getElementById("b_"+i).style.color="#000000"; document.getElementById("b_"+i).style.fontWeight="normal"; document.getElementById("b_"+i).style.backgroundColor= "#CCCCCC"; } } document.artikel.dot_position.value = button_nr; } //--> </script> </HEAD> <BODY OnLoad="seiten_zahl('1');">
<form name="artikel" action="" method="POST"> <input type="hidden" name="dot_position" value=""> <input type="hidden" name="gewaehlte_seite" value=""> <input type="hidden" name="punkt_anzahl" value="">
<table border="0" CELLSPACING="0" CELLPADDING="0" class="dot_frame_navi"> <tr> <td colspan="3" height="30" valign="top"> <!-- Reihe r1, Seitenzahl --> <script type="text/javascript"> <!-- var SeitenZahl = "2"; for(var i=1; i<=SeitenZahl; i++){ document.write("<input type='button' id='s_"+i+"' value='"+i+"' style='width=25;'"); document.write("OnClick="seiten_zahl("+i+")">\n"); } //--> </script> </td> </tr> <tr> <td colspan="3" height="10" valign="center"> <div style="width:100%; height:0; left:0; background-color:#000000;"><IMG SRC="../images/pixel.GIF" BORDER="0" width="2" height="1"></div> </td> </tr> <tr> <td rowspan="12>" valign="top"> <!-- Reihe r2, Punktezahl --> <? for($i=1; $i<=12; $i++){ // nur Bsp. $i<=12; ECHO "\t<input type='button' id='b_".$i."' name='".$i."' value='".$i."' style="width=25;" OnClick="button_farbe('".$i."');"><br>\n"; } ?> </td> <td rowspan="<%=count($row_main)%>"> </td> <td> <!--Begin der Reihe r3, Elementenliste, mit Elementen --> <?
foreach($row_main as $key => $value){
ECHO "<div style="left:0px; width:200px; border:0px solid blue; cursor:hand;" OnClick="werte('".($key+1)."', '".@$value["ID"]."', '".$value[1]."', '".$value[2]."', '".$value[3]."', '".$value[4]."')">\n"; ?> <table border="0" CELLSPACING="0" CELLPADDING="0"> <tr> <td width="90"> <? if(isset($value[1])){ ECHO $value[1]; } else { ECHO " "; } ?> </td> <td rowspan="3" align="right" valign="top" width="18%"> <%=$value[0]%> </td> ...
Hallo Bernhard,
Wie Du aus dem Code entnehmen kannst, ist oben ein Reihe von Button (ich nenne sie hier r1), die Angaben über die Seitenzahl und Links eine Reihe (ich nenne sie hier r2) von Button, die Anzahl der Punkte auf eine Seite, eine dritte Reihe (ich nenne sie hier r3) ist darunter, die Elementliste.
Wird die Seite aufgerufen bekommt der User die drei "Reihen", oben die Seiten (r1), links die Punkte (r2), in der "mitte" die Elementliste (r3). Nach dem laden der Seit ist "vorgewählt" ist die Seite eins, jetzt muss der User erst ein Punkt (r2) auf der linke Seite wählen, zu jedem Punkt(r2) kann er User ein Element aus der Elementlist (r3) in der "mitte" wählen. Hat der User ein Elelment(r3) gewählt soll die Seitenummer dahinter erscheine.
Nur so aus Neugier: Warum? Die ausgewählte Seite ist doch schon an der Farbe des angeklickten Buttons erkennbar.
Jetzt am konkretem Bsp. Auf der Seite 1 wählt der User in der Linke Buttonreihen(r2) ein Punkt als Bsp.: 3 aus danach wählt er ein Element aus der Elementenliste(r3) aus als Bsp.:8 aus, sobald er darauf auf den achten Element geklickt hat soll die grade ausgewählte Seitennummer dahinter stehen also die 1.
Mein Gedanke war sich alle Punkt aus der Reihe r2 und alle Elementenummern r3 aus der Elementenliste zu sammeln. in einem Array, der sollte ungefähr so aussehen.
seiten[1][3][8]
Sofort nach dem Aufbau sollte dieser Array auch ausgegeben werden.
Fangen wir mal mit dem Array an. Du hast mehrere Seiten, jede Seite hat mehrere Punkte und jeder Punkt mehrere Elemente. Dann brauchst Du dafür z.B. ein dreidimensionales Array, das Du mit PHP füllen kannst (nur ein grober Überblick, da ich kein PHP kann):
<head>
<title>...</title>
<script type="text/javascript">
// Globales Array
var seiten = new Array(<%= seitenzahl %>
<? Schleife über die Seiten, zaehler1 ?>
seiten[<%= zaehler1 %>] = new Array(<%= punktzahl_der_seite %>);
<? Schleife über die Punkte auf der Seite, zaehler2?>
seiten[<%= zaehler1 %>][<%= zaehler2 %>] = new Array(<%= elementzahl_des_punkts %>);
<? Schleife über die Elemente, zaehler3 ?>
seiten[<%= zaehler1 %>][<%= zaehler2 %>][<%= zaehler3 %>] = "<%= elementwert %>";
<? Ende Schleife Elemente ?>
<? Ende Schleife Punkte ?>
<? Ende Schleife Seiten ?>
// An dieser Stelle hast Du das Array komplett mit Seiten, Punkten und Elementen gefüllt.
// Auf ein einzelnes Element greifst Du mit seiten[seite][punkt][element] zu.
// hier kommen dann die Funktionen hin
</script>
</head>
<body>
Und jetzt die Ausgabe:
Die Tabelle mit der Kopzeile (Seiten) und der linken Spalte (Punkte) hast Du ja schon. Alle weiteren Spalten bekommen eine Id für das Element, das sie enthalten: <td="e_<%=punktnummer%>_<%=elementnummer%>">. Diese Tabelle legst Du auch mit PHP an, wobei Du nur Schleifen über die Punkte und Elemente brauchst, aber soviele Zeilen und Spalten anlegen musst wie _maximal_ Punkte/Elemente vorhanden sind. Jetzt kannst Du nach Auswahl einer neuen Seite die Tabelle so neu füllen (Wie Du an die Seitenzahl kommst erkläre ich später):
function fuellen() {
for (var i=0; i<seiten[seite].length; i++) {
for (var j=0; j<seiten[seite][i].length; j++]
document.getElementById("e_" + i + "_" + j).firstChild.nodeValue = seiten[seite][i][j];
}
}
}
Beachte, dass alle Schleifen bei 0 anfangen.
Die entsprechende Tabellenzelle darf nichts anderens enthalten als den Elementtext, damit das so funktioniert. Ausserdem solltest Du die nicht benötigten Zellen vorsichtshalber leermachen, falls sie durch diese Funktion nicht überschrieben werden.
Kommen wir zur Variable "seite". Das ist eine globale Variable, die Du jedesmal änderst, wenn einer der Seiten-Buttons angeklickt wird. Diese Variable kannst Du auch verwenden, um irgendwo anzuzeigen, welche Seite gerade ausgewählt ist.
Ich hoffe Du hast es mich verstanden worum es mir geht.
Das hoffe ich auch.
Grüße
Andreas
Hallo Andreas,
heute im laufe des Tages musste das "Anzeigen der Elemente" gelöst werden. Dieses Mal bin ich an das Problem von ganz andere Seite dran gegangen ohne Array ohne große Aufwand.
An dieser Stelle vielen Dank für Deine Hilfe, die Du mir geleistet hast, Dein Vorschlag von Gestern habe ich in Erwägung gezogen, leider kam ich mit ihm nicht klar :-(((( lag wohl an mir, denn persönlich komme ich mit PHP besser klar als mit JavaScript, JavaScript hat natürlich den unschlagbaren Vorteil, das bei jeder Kleinigkeit die Seite nicht jedes Mal neu geladen werden muss :-) Nicht desto trotzt mein persönlicher Eindruck über JavaScript ist, dass ich es JS immer interessanter finde westo länger ich damit arbeite :-)
Ab hier noch paar Sachen von gestern, die ich schon zusammen gefasst habe:
Wie Du aus dem Code entnehmen kannst, ist oben ein Reihe von Button (ich nenne sie hier r1), die Angaben über die Seitenzahl und Links eine Reihe (ich nenne sie hier r2) von Button, die Anzahl der Punkte auf eine Seite, eine dritte Reihe (ich nenne sie hier r3) ist darunter, die Elementliste. Wird die Seite aufgerufen bekommt der User die drei "Reihen", oben die Seiten (r1), links die Punkte (r2), in der "mitte" die Elementliste (r3). Nach dem laden der Seit ist "vorgewählt" ist die Seite eins, jetzt muss der User erst ein Punkt (r2) auf der linke Seite wählen, zu jedem Punkt(r2) kann er User ein Element aus der Elementlist (r3) in der "mitte" wählen. Hat der User ein Elelment(r3) gewählt soll die Seitenummer dahinter erscheine.
Nur so aus Neugier: Warum? Die ausgewählte Seite ist doch schon an der Farbe des angeklickten Buttons erkennbar.
Der User soll sehen wenn er sich auf eine andere Seiten befindet, welche Elemente schon gewählt worden sind. Sorry habe wider den Zweck vergessen :-((
Fangen wir mal mit dem Array an. Du hast mehrere Seiten, jede Seite hat mehrere Punkte und jeder Punkt mehrere Elemente.
Stop, bis zur dem Punkt stimmt, dh. jeder Seite hat mehrere Punkte aber jeder Punkt kann nur ein Element haben.
Falls Du Änderungen, Verkürzehrungen, Verbesserungen oder es komplett in der Variante mit Arrays lösen möchtest bin ich sehr erfreut darüber, denn schlisslich kennst Du Dich mit JS besser als ich.
Grüße Bernhard
In dem Code habe ich einige PHP Variable einfach belassen. Ab hier die Funktion: ...
var punkte_zahl = new Array(4); var zahl_der_artikeln = "12"; var seiten = new Array(2); function werte(element, id_nr, wert1, wert2, wert3, wert4){
var wochen_nr = 14; var layout_wahl = "dateiname"; var punkt = document.artikel.dot_position.value; // welchen Punkt auf der linke Seite hat der User grade angeklickt var seiteJ = document.artikel.gewaehlte_seite.value; //grade ausgewählte Seit in der Anzeigen
if(document.artikel.dot_position.value != ""){
for(var i=1; i<=zahl_der_artikeln; i++){ // Zahl der Elemnte
// Hier werden Elemente auf Null oder leer "" gesetzt die auf eine anderen Seiten, bzw. in einem anderem Punkt ausgewählt // worden sind. if(i==element){ for(var j=1; j<=<%=$seiten%>; j++){ for(var k=1; k<=<%=$punkt_max%>; k++){ document.getElementById("SEITEseite_"+j+"punkt"+k+"element"+i).innerHTML = ""; document.getElementById("ELEMENTseite_"+j+"punkt"+k+"element"+i).innerHTML = ""; } } } for(var j=1; j<=<%=$seiten%>; j++){ // Seitenzahl if(j==seiteJ){
for(var k=1; k<=<%=$punkt_max%>; k++){ // Max. Zahl der Punkt auf der linke Seite
if(k==punkt){
if(element == i){ document.getElementById("bgc_"+element).style.backgroundColor= "#99CC33"; document.getElementById("SEITEseite_"+j+"punkt"+k+"element"+i).innerHTML = seiteJ+"<br>"; document.getElementById("ELEMENTseite_"+j+"punkt"+k+"element"+i).innerHTML = punkt; } else { // Zuständig für das -löschen- der Zahlen beim angewähltem Punkt, dh. der User hat den Punkt 2 gewählt // und schaltent zwischen den Elemnten, es wird nur der letzt ausgewählte Elment gespeichert. document.getElementById("bgc_"+i).style.backgroundColor= "#FFFFFF"; document.getElementById("SEITEseite_"+j+"punkt"+k+"element"+i).innerHTML = ""; document.getElementById("ELEMENTseite_"+j+"punkt"+k+"element"+i).innerHTML = ""; } } } } } }
var gesammelte_werte = new Array(punkt, id_nr, wert1, wert2, wert3, wert4, wochen_nr, layout_wahl, zahl_der_artikeln, seiteJ); parent.dot_content.ausgabe_content(gesammelte_werte);
parent.top.head.location.href = "../htm/head.php?WEITER=<%=session_id()%>&tabelle_layout=ja&main_id="+id_nr+"&week="+wochen_nr+"&page="+seiteJ+"&field="+punkt+"&layout="+layout_wahl; var punktZahl = document.artikel.punkt_anzahl.value; // Die Anzahl der Punkte auf eine Seite
} else { alert("Fehler, bitte wählen Sie zurerst auf der linke Seite ein Punkt aus."); } } function seiten_zahl(seite_nr){
var wert_punkte = 0; for(var i=1; i<=punkte_zahl.length; i++){ if(i == seite_nr){ wert_punkte = punkte_zahl[(i-1)]; document.getElementById("s_"+i).style.backgroundColor= "#BDE7FF"; } else { document.getElementById("s_"+i).style.backgroundColor= "#CCCCCC"; } } if(wert_punkte == 0){ wert_punkte = punkte_zahl[0]; }
if(seite_nr){ document.artikel.gewaehlte_seite.value = seite_nr; document.artikel.punkt_anzahl.value = wert_punkte; } else { document.artikel.gewaehlte_seite.value = 1; document.artikel.punkt_anzahl.value = wert_punkte; }
punkte_aufbau(wert_punkte); }
function punkte_aufbau(wert_punkte_nr){
/* Die Variabel -auschalten- ist zuständig für das zurücksetzten alle Werte auf die Ausgangpositon beim wechseln zwischen den Seiten. */ var ausschalten = 0; for(var i=1; i<=4; i++){ // i<=4; nur Bsp. Wert if(i == wert_punkte_nr){ ausschalten = 1; document.getElementById("b_"+wert_punkte_nr).disabled=false; } else { if(i< wert_punkte_nr){ document.getElementById("b_"+i).disabled=false; } else { ausschalten = 1; document.getElementById("b_"+i).disabled=true; } } }
if(ausschalten == 1){ for(var i=1; i<=zahl_der_artikeln; i++){ document.getElementById("bgc_"+i).style.backgroundColor= "#FFFFFF"; } for(var i=1; i<=<%=$punkt_max%>; i++){ document.getElementById("b_"+i).style.color="#000000"; document.getElementById("b_"+i).style.fontWeight="normal"; document.getElementById("b_"+i).style.backgroundColor= "#CCCCCC"; document.artikel.dot_position.value = ""; } } } function button_farbe(button_nr){
for(var i=1; i<=4; i++){ // i<=4; nur Bsp. Wert if(button_nr == i){ document.getElementById("b_"+button_nr).style.color="#000000"; document.getElementById("b_"+button_nr).style.fontWeight="bold"; document.getElementById("b_"+button_nr).style.backgroundColor= "#99CC33"; } else { document.getElementById("b_"+i).style.color="#000000"; document.getElementById("b_"+i).style.fontWeight="normal"; document.getElementById("b_"+i).style.backgroundColor= "#CCCCCC"; } } document.artikel.dot_position.value = button_nr; } //--> </script> </HEAD> <BODY OnLoad="seiten_zahl('1');">
<form name="artikel" action="" method="POST"> <input type="hidden" name="dot_position" value=""> <input type="hidden" name="gewaehlte_seite" value=""> <input type="hidden" name="punkt_anzahl" value="">
<table border="0" CELLSPACING="0" CELLPADDING="0" class="dot_frame_navi"> <tr> <td colspan="3" height="30" valign="top"> <!-- Reihe r1, Seitenzahl --> <script type="text/javascript"> <!-- var SeitenZahl = "2"; for(var i=1; i<=SeitenZahl; i++){ document.write("<input type='button' id='s_"+i+"' value='"+i+"' style='width=25;'"); document.write("OnClick="seiten_zahl("+i+")">\n"); } //--> </script> </td> </tr> <tr> <td colspan="3" height="10" valign="center"> <div style="width:100%; height:0; left:0; background-color:#000000;"><IMG SRC="../images/pixel.GIF" BORDER="0" width="2" height="1"></div> </td> </tr> <tr> <td rowspan="12>" valign="top"> <!-- Reihe r2, Punktezahl --> <? for($i=1; $i<=12; $i++){ // nur Bsp. $i<=12; ECHO "\t<input type='button' id='b_".$i."' name='".$i."' value='".$i."' style="width=25;" OnClick="button_farbe('".$i."');"><br>\n"; } ?> </td> <td rowspan="<%=count($row_main)%>"> </td> <td> <!--Begin der Reihe r3, Elementenliste, mit Elementen --> <?
foreach($row_main as $key => $value){
ECHO "<div style="left:0px; width:200px; border:0px solid blue; cursor:hand;" OnClick="werte('".($key+1)."', '".@$value["ID"]."', '".$value[1]."', '".$value[2]."', '".$value[3]."', '".$value[4]."')">\n"; ?> <table border="0" CELLSPACING="0" CELLPADDING="0"> <tr> <td width="90"> <? if(isset($value[1])){ ECHO $value[1]; } else { ECHO " "; } ?> </td> <td rowspan="3" align="right" valign="top" width="18%"> <%=$value[0]%> </td> <td align="center" rowspan="3" width="20" id="bgc_<%=($key+1)%>"> <? for($i=1; $i<=$seiten; $i++){ for($j=1; $j<=$punkt_max; $j++){ echo "\t\t<span id='SEITEseite_".$i."punkt".$j."element".($key+1)."'></span>\n"; } } for($i=1; $i<=$seiten; $i++){ for($j=1; $j<=$punkt_max; $j++){ echo "\t\t<span id='ELEMENTseite_".$i."punkt".$j."element".($key+1)."'></span>\n"; } } ?> </td> </tr> <tr> <td> <? if(isset($value[2])){ ECHO $value[2]; } else { ECHO " "; } ?> </td> </tr> <tr> <td> <? if(isset($value[3])){ ECHO $value[3]; } else { ECHO " "; } ?> </td> </tr> </table> </div> <div style="width:200px; height:0; left:0; background-color:#000000;"><IMG SRC="../images/pixel.GIF" BORDER="0" width="1" height="1"></div> <? } ?>
</td> </tr> </table> </form> </BODY> </HTML>
Hallo Bernhard,
heute im laufe des Tages musste das "Anzeigen der Elemente" gelöst werden. Dieses Mal bin ich an das Problem von ganz andere Seite dran gegangen ohne Array ohne große Aufwand.
Hauptsache, es hat geklappt :-)
JavaScript hat natürlich den unschlagbaren Vorteil, das bei jeder Kleinigkeit die Seite nicht jedes Mal neu geladen werden muss :-)
Stimmt, aber auch den Nachteil, dass es nicht von jedem Client verstanden wird.
Fangen wir mal mit dem Array an. Du hast mehrere Seiten, jede Seite hat mehrere Punkte und jeder Punkt mehrere Elemente.
Stop, bis zur dem Punkt stimmt, dh. jeder Seite hat mehrere Punkte aber jeder Punkt kann nur ein Element haben.
Ok, das habe ich dann falsch verstanden.
[...] oder es komplett in der Variante mit Arrays lösen möchtest [...]
Nein, warum? Um so besser, wenn es auch einfacher geht.
for(var i=1; i<=zahl_der_artikeln; i++){ // Zahl der Elemnte
[...]
Die nächsten beiden Schleifen kannst Du Dir sparen, denn Du tust ja nur etwas, wenn der Schleifenzähler gleich einer vorgegebenen Zahl ist. D.h., Du entfernst die nächsten 4 Zeilen (und die zugehörigen "}") und ersetzt in den folgenden Zeilen j durch seiteJ bzw. k durch punkt.
for(var j=1; j<=<%=$seiten%>; j++){ // Seitenzahl
if(j==seiteJ){
for(var k=1; k<=<%=$punkt_max%>; k++){ // Max. Zahl der Punkt auf der linke Seite
if(k==punkt){if(element == i){
document.getElementById("bgc_"+element).style.backgroundColor= "#99CC33";
document.getElementById("SEITEseite_"+j+"_punkt_"+k+"_element_"+i).innerHTML = seiteJ+"<br>";
document.getElementById("ELEMENTseite_"+j+"_punkt_"+k+"_element_"+i).innerHTML = punkt;
} else {
// Zuständig für das -löschen- der Zahlen beim angewähltem Punkt, dh. der User hat den Punkt 2 gewählt
// und schaltent zwischen den Elemnten, es wird nur der letzt ausgewählte Elment gespeichert.
document.getElementById("bgc_"+i).style.backgroundColor= "#FFFFFF";
document.getElementById("SEITEseite_"+j+"_punkt_"+k+"_element_"+i).innerHTML = "";
document.getElementById("ELEMENTseite_"+j+"_punkt_"+k+"_element_"+i).innerHTML = "";
}
}
}
}
}
}
[...]
Nur noch mal zur Verdeutlichung; wenn Du sowas hast:
var a = 3;
for (var i=0; i<7; i++) {
if (i==a) {
mach_irgenwas(i);
}
}
dann brauchst Du keine Schleife, sondern kannst gleich schreiben:
mach_irgendwas(a);
In allen Fällen, wo i nicht gleich a ist, passiert ja garnichts.
Ich habe nur ganz grob drübergeschaut, und das war das Einzige, was mir sofort aufgefallen ist. (Den HTML/PHP-Teil habe ich mir übrigens nicht angesehen.)
Ich hoffe, jetzt funktioniert alles so, wie Du es Dir vorstellst.
Grüße
Andreas