You are not logged in.

wcf.regNote.message

Prometheus

Administrator

  • "Prometheus" started this thread

Posts: 3,278

  • Send private message

1

Tuesday, September 16th 2008, 11:17pm

Ich möchte ein dynamisches Formular mit Ajax realisieren und brauch dabei Hilfe.

Ich beschreibe mal was das Formular können soll vielleicht kann mir jemand mal einen Lösungsansatz geben. Leider gehören JS und somit auch Ajax absolut nicht zu meinen Fachgebieten und ich tu mich damit immer schwer.

Das Formular besteht aus einem Feld für das Datum, einem Dropdown für eine Person, einem Textfeld für einen Kommentar zu der Person und dann aus 10 oder mehr Feldern in denen Werte gespeichert werden. Wie viele Felder für diese Werte es gibt und welche das sind wird in einer anderen Tabelle definiert. Zu jeder Person kann man nun festhalten welche Felder aktiv sein sollen. Das heißt in der Maske zum editieren der Personendaten habe ich Checkboxen mit denen ich festlege welche Zusatzfelder für die Person aktiv sein sollen. Nun möchte ich das das Formular um das es sich dreht so aufgebaut ist, das ich zuerst das Datum auswähle, dann die Person auswähle und sobald die Person gewählt ist soll nachgesehen werden welche Zusatzfelder für diese Person aktiv sind und auch nur diese sollen dann eingeblendet werden. Habe ich mich vertan und wähle doch eine andere Person aus sollen die Zusatzfelder auch wieder zu der Person passen und die die nicht aktiv sind sollen verschwinden. Ich könnte natürlich auch zu allen Personen die möglichen Feldkombinationen in ein Array laden und per OnSelect dann die Felder aktivieren oder deaitivieren. Da aber Ajax einfach ein sehr interessantes Thema ist möchte ich das in jedem Fall damit lösen.

Die Frage ist nur wie fange ich an? Ich habe meine Tabelle mit Personen, die Tabelle mit den Feldern und die Tabelle in der die Daten aus dem Formular abgelegt werden. Im Moment bin ich mir noch gar nicht so sicher wie ich das überhaupt machen soll da die Datentabelle aktuell 10 Felder hat für die Zusatzfelder. Kommen nun noch 2 dazu müsste ich eigentlich die Tabelle erweitern. Geht natürlich alles aber vielleicht fällt jemand noch eine geniale Lösung ein an die ich noch nicht gedacht hab.
Jedwege Anfragen bitte an Technomausi oder ShaoKhan richten. Dieses Konto ist und bleibt inaktiv.

comand

Beginner

Posts: 12

  • Send private message

2

Wednesday, September 17th 2008, 7:05pm

ich würde die felder in eine zwischentabelle speichern

also

personen_tbl --> (tablle mit personen_id und feld_id) --> Feld_tbl ( id , name, inhalt )

so ca.

und das ajax kannste ja dynamisch daraus dann aufbauen lassen und zum verschicken packste einfach alle dynamsichen felder in ein formular und verschickst das gesammte formular seralisiert per ajax ( prototype hat z.b ne funktion zum seralisieren von gesammten forms )

hab grad leider nicht die zeit das ganauer zu erklären vil komm ich nacher noch dazu ;)

Prometheus

Administrator

  • "Prometheus" started this thread

Posts: 3,278

  • Send private message

3

Wednesday, September 17th 2008, 8:03pm

OK die Antwort von Dir ist sicher nicht schlecht. Setzt aber voraus das man bereits mit Ajax was gemacht hat. Bei mir ist das leider nicht der Fall. Ich umgehe auch JS wo ich nur kann da ich damit einfach nicht richtig warm werde. Würde es dennoch aber gerne ein Stück weit mehr verstehen und lernen. Deswegen ja meine Frage ;)

Bezüglich der Tabellen so gibt es bereits eine Tabelle mit Personen, eine Tabelle mit den möglichen Feldern und eine Tabelle in der die Kombination aus Person und Feldern festgelegt wird. Das heißt in der Tabelle für die Kombinationen gibt es pro Person und pro Feld einen Eintrag etwa wie folgt.

Person ID = 1
Feld ID = 1 bis 12

Einträge in der Tabelle der Kombinationen
Pers. ID - Feld ID
1 - 1
1 - 5
1 - 6
1 - 7
1 - 12

Und das eben dann für jede Person. Ich kann also jederzeit die Felder erweitern und muss dann eben nur festlegen bei welcher Person welches Feld aktiv sein soll. Da der Personenkreis auf geschätzte 50 begrenzt ist macht das auch nicht so viel Arbeit. Ich kann nur keine Vorbelegung machen da wirklich jede Person ganz individuelle Kombinationen aus Feldern hat.

Nun gut gehen wir davon aus ich habe ein Formular in dem aktuell folgende Felder vorhanden sind.

Datum, Person, Bemerkung, Feld1, Feld2, Feld3, Feld4 ... Feld10

Das heißt die 10 Felder sind statisch für jede Person verfügbar. Beim Abschicken des Formulars wird auch nichts geprüft sondern es wird einfach alles in die Datenbank geschrieben. Erst bei der Auswertung wo dann wieder relevant ist welche Person welches Feld hat wird berücksichtigt welches Feld die entsprechende Person hat und der rest einfach nicht berücksichtigt. Ist natürlich nicht Sinn der Sache und sollte so nicht sein. Deshalb eben die Dynamik die ich da rein haben möchte.
Jedwege Anfragen bitte an Technomausi oder ShaoKhan richten. Dieses Konto ist und bleibt inaktiv.

comand

Beginner

Posts: 12

  • Send private message

4

Wednesday, September 17th 2008, 10:31pm

ich schlag dir auf jedenfall prototyp vor..

schau dir das mal an

http://www.prototypejs.org/api/ajax/request

must nur das framework einbinden und dann kannste das so ausführen,
da kannste angeben welche php datei aufgerufen wird und was bei erfolgreichen aufrufen passieren soll und mit dem rückgabe wert der datei kannste in js weiterarbeiten ( z.b php gibt ein array json codiert aus , das script fängt diesen rückgabewert auf encodiert es und dann kannste mit dem array in javascript weiterarbeiten ( felder füllen,weitere abfragen starten,..)

und um ein komplette formulat zu serialisieren um es per ajax an eine datei zu schicken wäre dannd as hier

http://www.prototypejs.org/api/form/serialize


prototype hat n haufen von praktischen funktionen

z.b ein elmenet über eine id auszufählen ( um t.b n input zu füllen ) würde z.b ganz einfach so gehen

$('id_des_elementes').value = "ihrgendwas";

fereinfacht js echt um einiges ;) da gibts für fast alles ne vereinfachte form

:D

Prometheus

Administrator

  • "Prometheus" started this thread

Posts: 3,278

  • Send private message

5

Thursday, September 18th 2008, 9:26am

Nun gut, das mit Prototype leuchtet mir ein. Allerdings möchte ich bevor ich jetzt anfange ein Framework einzubauen erst mal schauen wie weit ich mit Handarbeit komme. Dummerweise hab ich nicht ewig Zeit und muss das am Wochenende spätestens fertig bekommen.

Das heißt ich stelle jetzt mal gezielte Fragen und hoffe auf Antwort ;)

Im Formular wähle ich in einem Dropdown was aus. Wie übergebe ich das "value" des Dropdown so, dass anhand diesem dann in der Datenbank in der entsprechenden Tabelle die passenden Einträge gesucht werden?
Wie behandle ich den Rückgabewert so, dass er mir Eingabefelder pro gefundenem Eintrag in der DB erzeugt? Mit einem Div-Container am besten? Beim Absenden des Formulars muss da irgendwas berücksichtigt werden oder kann ich jedem Feld einen Namen geben und genau so behandeln wie ein statisches Formular?
Jedwege Anfragen bitte an Technomausi oder ShaoKhan richten. Dieses Konto ist und bleibt inaktiv.

Prometheus

Administrator

  • "Prometheus" started this thread

Posts: 3,278

  • Send private message

6

Monday, September 22nd 2008, 9:16am

Ich hab mich am Wochenende in das Thema mal ein wenig eingelesen. Bin zwar noch lange nicht so weit das ich es hin bekommen hätte aber dennoch verstehe ich zumindest langsam wie das Zusammenspiel von PHP-JS(Ajax) und Server so funktioniert.

Mein Problem ist das ich nicht weiß wie ich nun vorgehen soll um das so hin zu bekommen wie ich das möchte. Ich kann wenn ich in meinem Select eine Auswahl treffe einen Request absetzen welcher auch eine Funktion auslöst oder sonst irgendwas. Allerdings wie mache ich das, dass ich dann als Antwort z.B. ein Array zurück bekomme anhand dessen dann im Formular die Felder eingeblendet werden? Oder kann ich als Rückgabewert so gesehen html Code bekommen welcher dann interpretiert wird? Denn ich muss ja irgendwie die Input Felder bekommen und will als Rückgabe nicht nur Value oder sowas. Das heißt mit zwei Select Feldern hab ich das hin bekommen nur eben nicht das in Abhängigkeit der ersten Auswahl die zweite komplett aufgebaut wird.

Wie stelle ich das an?
Jedwege Anfragen bitte an Technomausi oder ShaoKhan richten. Dieses Konto ist und bleibt inaktiv.

comand

Beginner

Posts: 12

  • Send private message

7

Monday, September 22nd 2008, 5:55pm

Also du hast dein SELECT das per onChange oder derartiges ein ajax request an eine php datei schickt . diese php datei liefter dir dann die entsprechenden daten. im JS verarbeitest die dann.

entweder gibste in php n array aus das du vorher mit JSON decodest
und in JS dann encodest so das du in JS das array wieder hast.

oder du gibt html code aus (z.b ein neues Select feld)

und sagst im JS danneinfach

Source code

1
document.getElementById('id_des_divs_in_das_der_html_code_soll').innerHTML = VariableInDerDasHTMLSteht;

oder wenn du mit Arrays arbeitest dementsprechend anderst.

Kannst auch per JS neue elmenete erzeugen.

Source code

1
2
3
4
var NeuerInput = document.createElement('input');
NeuerInput.value = "ihrgendwas";

document.getElementById('id_wo_drin_das_element_eingefügt_werden_soll').apendChild(NeuerInput);


Hoffe das hilft dir n bisle weiter.

Prometheus

Administrator

  • "Prometheus" started this thread

Posts: 3,278

  • Send private message

8

Friday, September 26th 2008, 2:14pm

Also ich hab die Idee mit dem Ajax mal wieder verworfen und mich auf herkömmliche Methoden beschränkt. Das heißt jede Feldänderung oder Auswahl in einem Select löst ein Submit aus. Auf dem Server prüfe ich dann ob ein verstecktes Feld gesetzt ist und der eigentliche Submit Button setzt gleichzeitig dieses Feld dann damit der Datensatz auch tatsächlich gespeichert wird. Problem ist im Moment dann erst mal noch das es jedes mal neu läd und ich rechne damit das in Zukunft daraus Probleme entstehen wenn mehrere User daran arbeiten. Aber ich muss erst mal fertig werden bevor ich mir darüber Gedanken machen kann.
Jedwege Anfragen bitte an Technomausi oder ShaoKhan richten. Dieses Konto ist und bleibt inaktiv.

xundy

Beginner

Posts: 37

  • Send private message

9

Tuesday, October 7th 2008, 7:48am

Also Ajax ist sicher ein nettes Feature, aber ganz trivial ist es nicht.

Bei deinem Problem mußt du eben auch mit Funktionen, aber in JS arbeiten.

Wenn Du also deine Eingabe verarbeiten willst, musst du eine Funktion in JS erstellen, der Du die Parameter übergibst, dort können dann auch noch Prüfungen oder auch Formatierungen geschehen, erst jetzt sendest du die Daten per ajax-Request ab, also du übergibst damit deine Eingabe an eine php-Funktion, dort kannst Du dann nach schreiben der Daten, gleich eine neue Abfrage der neuen Werte starten, die die Funktion als Rückgabewert an deine JS-Funktion sendet(war ja ein js-request), diese Daten kannst Du dann wieder in die Felder schreiben.

Wichtig ist eigentlich zu wissen, das eine Funktion in JS immer einen Rückgabewert erwartet, kommt keiner, weil ein Fehler in der php- oder auch jsFunktion ist gibt nen Error, selbst wenn man mit dem Rüchgabewert nicht weiter arbeiten will, muß man sich darum kümmern, dies kann mit Hilfe von TRUE, FALSE oder auch return erfolgen.

Der IE reagiert bei solchen Fehlern recht restriktiv und führt nach einem JS-Fehler kein weiteres JS in der Seite mehr aus, da ist der FF kulanter, daher soltte man immer die Fehlerkonsole beim FF im Auge haben, da auch die Fehlermeldung hier weitaus hilfreicher sind als im IE.

Also sollte man sich vorher genau überlegen ob der Einsatz von Ajax überhaupt sinnvoll ist, denn wenn man nicht mehr Übersichtlichkeit oder Performance erreicht, ist der Aufwand doch meist nicht wirklich lohnend.

Vorgefertigte Klassen wie JSON und ähnliche erleichtern zwar den Einsatz, aber man sollte sich mal ein wenig den Code der verwendeten Klassen anschauen, um mal zu sehen wieviel Aufwand hinter nem kleinen netten Gimmick stecken kann.

Das größte Problem ist eh die Crossbrowser-Kompatibilität, am meisten Erfolg hat man mit dem Datenversand als xml, doch XML und JS sendet Daten standardmäßig als UTF-8, wer aber Seiten verwendet die nicht mit diesem Zeichensatz arbeiten(selbst das wbb2 ist nicht zu 100% UTF-8-fähig), stößt immer wieder auf Probleme da es reichlich Sonderzeichen gibt die dann gefiltert und aufbereitet werden müssen.

Es gibt ja zum Glück reichlich Coder die versuchen das Zusammenspiel von JS und php immer weiter zu vereinfachen, aber wirklich trivial wird es wohl nie werden, je interaktiver man das ganze möchte um so größer wird der Aufwand, aber natürlich macht es am Ende auch Spass mal was neues hinbekommen zu haben, und doppelt Spass macht es wenn es denn auch noch nützlich ist :D

mfg

wcf.user.socialbookmarks.titel