Formular, dass dynamisch Eintragsmöglichkeiten erweitert

[Axel]

Hallo,

ich möchte ein Formular in einem Browser anzeigen lassen, in dem der Benutzer eine mir vorher nicht bekannte Anzahl von Einträgen machen können soll. Am besten ein Bsp.:

Zu bestellende Pizzen:

1 x Pizza Salami
2 x Pizza Hawai
1 x Funghi
3 x Calzoni

Es ist ja nicht weiter schwer, ein Formular mit vier möglichen Bestellungen zu entwerfen. Ich hätte es jetzt aber gerne dynamisch, d.h. der Benutzer soll die Möglichkeit haben, unbegrenzt viele Pizzen zu bestellen. Am liebsten wäre mir eine Möglichkeit, ohne vorher nach der Gesamtzahl zu fragen und ohne einen Button "Weitere Bestellung", wonach erst das gesamte Formular per CGI um eine Zeile erweitert und neugeladen wird. Am besten: sobald der User in die letzte freie Zeile springt, soll darunter die nächste freie erscheinen und der Text einfach nach unten rücken. Illusorisch?

[wahsaga]

hi,

sobald der User in die letzte freie Zeile springt, soll darunter die nächste freie erscheinen und der Text einfach nach unten rücken. Illusorisch?

nein, lediglich von deinen javascript-kenntnissen abhängig.

wo ist dein bisheriger ansatz?

gruß,
wahsaga

[Maxx]

Hallo Axel,

sobald der User in die letzte freie Zeile springt, soll darunter die nächste freie erscheinen und der Text einfach nach unten rücken. Illusorisch?

nö, ganz einfach. Dir fehlt vermutlich der Ansatz?

Dein Formular hat ein <input> für die Bestellung. Darin enthalten ist ein Eventhandler "onFocus". Dieser Eventhandler ruft nun eine Methode zum Erzeugen eines neuen <input> auf
Die Methode selbst braucht hierfür:

  
  inp=document.createElement("input");  
  inp.setAttribute("type","text"); und was du sonst noch brauchst ...  
  inp.setAttribute("onFocus","DeineMethode()");  
  

Das so erzeugte <input> muss jetzt nur noch eingehängt werden. Idealerweise hast du irgendwo eine entsprechende ID wo das Input hin soll.

  
  document.getElementById("bestellung").appendChild(inp);  
  

Das war es auch schon ...
Achja, vorher solltest du natürlich noch den onFocus-Handler vom (bis dahin) letzten <input> entfernen. Selbiger sollte ja nur im (neuen) letzten Eingabefeld aktiv sein.

removeAttribute(); ist dein Suchbegriff.

Fragen?

HTH

Jochen

[Ingo Turski]

Hi,

Dein Formular hat ein <input> für die Bestellung. Darin enthalten ist ein Eventhandler "onFocus". Dieser Eventhandler ruft nun eine Methode zum Erzeugen eines neuen <input> auf

schade. Denn dann könnte ich ohne Javascript nur eine einzige Bestellung machen. Und selbst mit aktiviertem Javascript würde ich mir überlegen, ob eine einzige Bestellung ausreicht - denn woher sollte ich wissen, daß das Formular von Geisterhand erweitert wird?

Eine für Standardfälle ausreichende Anzahl an Feldern sollte von vornherein angeboten werden. Eine Erweiterung könnte dann erfolgen, wenn vielleicht weniger als drei freie Felder übrig sind. Wobei mir ein Button "weitere Bestellungen" vermutlich auch reichen würde.

freundliche Grüße
Ingo