Dynamisches Formular mit AJAX - Probleme...
Robert123
- javascript
Hallo Forum,
bin derzeit dabei, meine ersten Gehversuche mit AJAX zu machen - leider will das absolut nicht wo wie ich es will.
Ich möchte ein dynamisches Formular erstellen. Und zwar in der Form, dass man mehrere Zeilen mit unterschiedlichen Daten eintragen kann. Jedesmal wenn eine neue Zeile begonnen wurde, soll unterhalb eine leere Zeile neu hinzukommen, sodass man praktisch endlos viele Daten hinzufügen kann. Das ganze soll so aussehen:
Nun habe ich mir gedacht, das geht am besten, indem wenn man das erste Dropdownmenü ganz links ändert, dass dann eine neue Zeile erscheinen soll. Um nicht die Daten zu verlieren, sollen alle bisherigen Eingaben ebenfalls an das PHP-Skript übermittelt werden und der ganze block wieder ausgegeben werden (vorhandene Zeilen samt Daten + neue Zeile).
Jetzt habe ich schon viele verschiedene Möglichkeiten die mir eingefallen sind ausprobiert, aber keine will funktionieren. Habt ihr eine Idee, wie das am besten zu bewerkstelligen geht?
Oder vielleicht kennt ihr ein Beispiel zum ansehen (hab leider keines gefunden).
Danke.
lg
robert
Anhang, einige meiner Ideen, vielleicht kann daran angesetzt werden
_______________________________________
<select name="bewerbe" size="1" id="bew0">
Eine Überlegung war, alle gleichen Dropdowns als Array für PHP bereitzustellen (name="bewerbe[]"). Diese Syntax mit den eckigen Klammern scheint das Javascript nicht zu mögen.
Nächster Versuch: Eindeutige Nummerierung aller Dropdowns mit den selben Inhalt per IDs (bewX) und zugriff über getElementById.
Leider gibts damit dauernt Probleme, also über getElementById komme ich nicht an die Daten ran. Hier mal ein weiteres Beispiel:
var check=false;
var count=0;
var elem="";
do{
elem="bew"+count;
if(document.getElementById[elem]) {
// HIER DANN DIE BEARBEITUNG - SPEICHERN DER INHALTE IN EIN ARRAY UND ÜBERGABE AN EUN PHP-SKRIPT NACH DER SCHLEIFE
count++;
check=true;
alert(count);
}
else
check=false;
} while(check);
Problem: wie checke ich eigentlich wie viele Elemente eines Typs verfügbar sind - wäre wichtig für die Schleife. Hab das mal so wie oben gemacht und hoffe, dass das getElementById ein true oder false zurückgibt, falls es exisitiert oder nicht. Oder gibts eine ander Möglichkeit die Existenz zu prüfen?
Würde überhaupt die Übergabe eines JS-Array an ein PHP-Skript funktionieren?
Hi,
Um nicht die Daten zu verlieren,
Wieso sollten Daten verloren gehen, wenn du lediglich mit JavaScript neue Formularelemente hinzufügst?
sollen alle bisherigen Eingaben ebenfalls an das PHP-Skript übermittelt werden und der ganze block wieder ausgegeben werden (vorhandene Zeilen samt Daten + neue Zeile).
Das ist unsinnig.
Fügr die neuen Felder ins Formular ein, ggf. mit dafür per AJAX vom Server geholten Daten, die du zu ihrer Erstellung benötigst.
wie checke ich eigentlich wie viele Elemente eines Typs verfügbar sind
Definiere „Typ”.
MfG ChrisB
Danke einmal für deine Antwort - hat doch auch recht viel Licht in die Sache gebracht ;)
Um nicht die Daten zu verlieren,
Wieso sollten Daten verloren gehen, wenn du lediglich mit JavaScript neue Formularelemente hinzufügst?
Hier stellt sich wieder die Frage: Wie füge ich neue Elemente hinzu? Angenommen die Formularfelder sind in einem Div oder Span eingebettet und ich will neue am Ende hinzufügen. Schreibe ich jetzt mit "innerHTML" auf diesen Bereich, werden doch alle zuvor vorhandenen Formularelemente überschrieben... daher auch die Idee diese vorher zu sichern (auch wenn dies vermutlich ein Blödsinn ist, wenn ich die Möglichkeit hätte einfach neue Elemente anzuhängen).
sollen alle bisherigen Eingaben ebenfalls an das PHP-Skript übermittelt werden und der ganze block wieder ausgegeben werden (vorhandene Zeilen samt Daten + neue Zeile).
Das ist unsinnig.
Stimmt... :)
Fügr die neuen Felder ins Formular ein, ggf. mit dafür per AJAX vom Server geholten Daten, die du zu ihrer Erstellung benötigst.
wie checke ich eigentlich wie viele Elemente eines Typs verfügbar sind
Definiere „Typ”.
Mit selben Typ meine ich alle Dropdownmenüs für "Bewerb" oder alle Dropdonws "Wertungsklasse" etc... dh im Prinzip nur, wie oft sich diese Zeile bereits wiederholt hat.
Mit einer reinen Javascriptlösung (also Anhängen neuer Felder) wäre dies vermutlich noch einfacher - per Zählvariable...
MfG ChrisB
moin,
mein Vorschlag, Ihr Programm:
Lerne Javascript
Auslesen von Formularlelementen by id/name
Eventsteuerung
Einfügen von Inhalten in das DOM
Lerne Ajax
Erstellen XHR-Objekt
Senden eines Requests mit POST/GET und dem XHR-Objekt
Request am Server mit PHP entgegennehmen und Response erzeugen
Einbau der Response in das DOM
Und dann ein bischen mehr:
das DOM, Parent/Child Nodes, Events...
Hotti
Mahlzeit Robert123,
Anhang, einige meiner Ideen, vielleicht kann daran angesetzt werden
_______________________________________
<select name="bewerbe" size="1" id="bew0">
Eine Überlegung war, alle gleichen Dropdowns als Array für PHP bereitzustellen (name="bewerbe[]"). Diese Syntax mit den eckigen Klammern scheint das Javascript nicht zu mögen.
Das ist nicht korrekt: <http://de.selfhtml.org/javascript/objekte/elements.htm#allgemeines@title=Schema 4> und gut is' ...
Problem: wie checke ich eigentlich wie viele Elemente eines Typs verfügbar sind
Indem Du sie http://de.selfhtml.org/javascript/objekte/document.htm#get_elements_by_tag_name@title=heraussuchst und anschließend <http://de.selfhtml.org/javascript/objekte/array.htm#length@title=ihre Anzahl ermittelst>?
Würde überhaupt die Übergabe eines JS-Array an ein PHP-Skript funktionieren?
Jein. Nicht direkt. Wenn es allerdings nur simple Datentypen enthält, könntest Du Dir in Javascript eine Funktion schreiben, die das Array analog zur PHP-Funktion serialize() umwandelt ... das kannst Du dann in PHP wunderbar "unserialisieren" und hast alle Werte wieder in einem Array vorliegen.
MfG,
EKKi
Hi!
Würde überhaupt die Übergabe eines JS-Array an ein PHP-Skript funktionieren?
Jein. Nicht direkt. Wenn es allerdings nur simple Datentypen enthält, könntest Du Dir in Javascript eine Funktion schreiben, die das Array analog zur PHP-Funktion serialize() umwandelt ... das kannst Du dann in PHP wunderbar "unserialisieren" und hast alle Werte wieder in einem Array vorliegen.
Irgendjemand hat dafür JSON erfunden. Kommt auch mit komplexeren Typen zurecht.
Lo!