Hallo Zusammen,

Manche Homepages reagieren auf Benutzereingaben ohne dass die Seite neu geladen wird.
Sprich wenn ich bei ein Textfeld ausfülle erscheint automatisch ein Weiteres oder Informationen dazu.
Wie wird so etwas gemacht? Ist das möglich nur mit HTML/PHP/CSS, also ohne javascript o.Ä...?

Gruss DexXxtrin

Hi

Nein, das ist JavaScript.
Genauer gesagt Ajax.

Mit Flash oder sogar Java wäre es auch möglich, aber das wäre Kanonen-auf-Spatzen.

Gruß

Ok. Ajax tönt für mich schon was besser als JavaScript.
Bitte korrigieren wenn ich mich irre:
JavaScript kann ja deaktiviert oder nicht unterstütz sein, was bedeuten würde, dass das nicht funktioniert.
Wie ist das mit Ajax? Kenne Ajax noch überhaupt nicht...

Ajax ist ein Teilbereich von Javascript.
Wenn JS deaktiviert ist, geht Ajax auch nicht.

(Ich bin mir gerade nicht sicher, ob ich dich richtig verstanden habe.
Den Ajax-Teil brauchst du nur, wenn die zusätzlichen Infos je Eingabe vom Server
geholt werden müssen. Wenns auch ohne Serverkontakt geht, richt das normale JS).

Entweder ignoriert man den (kleinen) Teil der Leute, die JS nicht mögen,
oder muss die Seite so machen, dass sie auch ohne JS bedienbar bleibt:
Neben das EIngabefeld einen Button Absenden oder so und beim Laden der Seite
diesen Button mit JS verschwinden lassen.

Wenn man JS an hat:
Seite wird geladen, Button wird nicht angezeigt, Eingabe wird von JS verarbeitet.
Wenn JS aus ist:
Seite wird geladen, JS kann den Button nicht verschwinden lassen.

Den Server braucht es eigentlich nicht.
Es geht nur darum, wenn ein Textfeld ausgefüllt wurde, ein weiteres darzustellen.
Oder wenn ein Textfeld aktiv ist, eine Box mit Informationen dazu (Bei einem Formular, damit es verständlicher wird für den Benutzer).

Dann gehts auch ohne Ajax, nur JS.

Also ich das jetzt mal verschiedene Sachen versucht von diversen Seiten im Internet, aber komme einfach nicht auf das gewünschte Ziel.
Ich habe auf meiner Seite eine Tabelle, in welcher sich das Formular befindet.
Jedes Eingabefeld eine neue Zelle.
Nun möcht ich, dass wenn beim einten Textfeld eine Eingabe getätigt wird automatisch ein nextes erscheint. Bei dem ist es dann wieder das Selbe.
Nun mein Problem: Ich schaffe es nicht, ein neues Textfeld in meine Struktur einzufügen. Hab zwar Code-Schnipsel gefunden mit denen ich es geschaft habe ein neues zu erstellen, allerdings nicht am gewünschten und mit der gewünschten Formatierung.

Wäre sehr froh um Hilfe

Meine Struktur:

HTML-Code:

<table cellspacing="1" cellpadding="0" border="0" width="100%" align="center" valign="top" style="font-size: 1em; margin: 20px;">
				
<form action="index.php?sid=carsubmit" method="post">
<tr height="30px"> 

   <td align="left" valign="middle" width="20%">Nachname*:</td>

   <td align="left" valign="middle" width="80%"> 

     <input type="text" size="30" name="lastname">

   </td>

 </tr>

 <tr height="30px"> 

   <td align="left" valign="middle" width="20%">Vorname*:</td>

   <td align="left" valign="middle" width="80%"> 

      <input type="text" size="30" name="prename">

   </td>

 </tr>

 <tr height="30px"> 

   <td align="left" valign="middle" width="20%">Adresse*:</td>

   <td align="left" valign="middle" width="80%"> 

     <input type="text" size="30" name="address">

   </td>

 </tr>
</form>
</table>

PS: bitte ins JavaScrip Forum verschieben

Versuche mal das hier:

HTML-Code:

<script language="javascript" type="text/javascript">
function zeile(feld) {
if (document.getElementById(feld).value.length != 0) {
    document.getElementsByTagName("tr")[feld + 1].style.display = "block";
} else if (document.getElementById(feld).value.length == 0) {
    for (feld; feld < 2; feld++) {
        document.getElementsByTagName("tr")[feld].style.display = "none";
    }
}

}
</script>

<form action="index.php?sid=carsubmit" method="post">
<table cellspacing="1" cellpadding="0" border="0" width="100%" align="center" valign="top" style="font-size: 1em; margin: 20px;">
    <tr>
        <td align="left" valign="middle" width="20%">Nachname*:</td>
        <td align="left" valign="middle" width="80%"><input type="text" size="30" name="lastname" id="0" onkeyup="zeile(0);"></td>
    </tr>
    <tr style="display: none;">
        <td align="left" valign="middle" width="20%">Vorname*:</td>
        <td align="left" valign="middle" width="80%"><input type="text" size="30" name="prename" id="1" onkeyup="zeile(1);"></td>
    </tr>
    <tr style="display: none;">
        <td align="left" valign="middle" width="20%">Adresse*:</td>
        <td align="left" valign="middle" width="80%"><input type="text" size="30" name="address" id="2" onkeyup="zeile(2);"></td>
    </tr>
</table>
</form>

Funktioniert bei mir nicht....
Es macht zwar etwas (Formatierung des Textes, an einem anderen Ort ändert sich) allerdings ist kein neues Element zu sehen..

Sorry, nich gut genug getestet. Aber mit diesem Script hat es bei mir jetzt wirklich geklappt.

Code javascript:

1 2 3 4 5 6 7 8 9 10 11

function zeile(feld) {   if (document.getElementById(feld).value.length != 0 && feld < 2) {     document.getElementsByTagName("tr")[feld + 1].style.display = "block"; } else if (document.getElementById(feld).value.length == 0 && feld < 2) {     for (feld++; feld <= 2; feld++) {         document.getElementsByTagName("tr")[feld].style.display = "none";     } }   }

bei mir erzielt es immernoch den selben Effekt....

Mit diesem Script bin ich bis jetzt am weitesten gekommen. Allerdings wir hier hier immer nur das Textfeld eingefügt und immer das neuste zuoberst...

Code javascript:

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22

<script type="text/javascript"> var i=1; function NeuesFeld() { i=i+1;   var row = document.getElementById("form").insertRow( document.getElementById("form").rowIndex+i+1 ); var cell = row.insertCell( 0 );   var text = document.createTextNode( 'Begleitperson ' + (i) ); cell.appendChild( text );   cell = row.insertCell( 1 );   var input = document.createElement( 'input' ); input.type = 'text'; input.name = 'nummer[]'; input.size = 38; cell.appendChild( input );   } </script>

Zitat von DexXxtrin

PS: bitte ins JavaScrip Forum verschieben

Ok, JavaScript.

Wie geschrieben, bei mir klappt es damit wie es soll.

Wenn ich jetzt noch verstehen würde was du mit "...Formatierung des Textes, an einem anderen Ort ändert sich..." und "...bei mir erzielt es immer noch den selben Effekt..." meinst könnte ich mich vielleicht trotzdem auf die Fehlersuche machen.

Hast du zum Testen das Javascript und den HTML-Code übernommen oder nur das Script kopiert? Dann kann es nicht klappen!

Hier sonst die ganze Page: *
Es handelt sich um das Feld "Begleitperson". Dort sollte immer wieder ein neues erscheinen.

Jetzt komme ich mit.
Du hattest oben nur eine Tabelle mit 3 Textfeldern. Ich habe es so verstanden das immer nach dem Ausfüllen das jeweils nächste Feld erscheinen soll.