HTML-Formular funktioniert nicht richtig,warum?


01.06.2022, 21:24

Habe noch

<input type="submit"> 

geschrieben.

Mit dem Submit-Button geht es und es geht jetzt auch ohne, also mit der Enter-Taste. Warum es vorhin nur mit der Enter-Taste nicht ging ist mir bis jetzt nicht bekannt.

Danke im Voraus!

3 Antworten

Ein Formular besteht im Grunde immer aus drei wesentlichen Elementen und Attributen. Dazu zählt auch ein Submit-Button, den du jetzt eingefügt hast.

  • Im action Attribut wird angegeben, wohin die Daten übertragen werden
  • Mit dem method Attribut wird festgelegt, wie die Daten übertragen werden
  • Mit einem Button vom Typ submit wird bestätigt, die Daten zu verschicken

Wenn du den Submit-Button verbergen möchtest, kannst du u.a. das HTML-Universalattribut hidden verwenden. Dieses funktioniert im Grunde wie Eigenschaft display: none in CSS. Sprich, das Element wird nicht angezeigt.

<input type="submit" hidden />
Woher ich das weiß:Berufserfahrung – UI/UX Designer, Full-Stack Developer

wäre mal gut, wenn du bei method POST benutzt...

Woher ich das weiß:Studium / Ausbildung – Informatikstudent
CitrusApfel2 
Fragesteller
 01.06.2022, 21:25

Ich weiß, doch das beantwortet weder meine Frage noch mache ich gerade recht viel anders als wie bei dem Tutorial gezeigt wird.

Trotzdem danke

0
whgoffline  01.06.2022, 21:42
@CitrusApfel2

sorry, habe mich verkuckt. Was aber komisch ist, ist, dass dein code bei mir funktioniert. Wo hast du denn den <input type="submit"> hin gemacht.

0
CitrusApfel2 
Fragesteller
 01.06.2022, 21:47
@whgoffline

Keine Ursache, passiert.

So sieht der Code nun aus:

<!DOCTYPE html>
	<head>
	<html lang="de">
		<meta charset="UTF-8">
		<meta name="viewport" content="width=device-width", initial-scale=1.0>
		<title>Daten über dich</title>
	</head>
	<body>
		<form action="" method="GET"> 
			<label for="Name">Name:</label>
			<input id="Name" name="Name" type="text" placeholder="Ihren Name eingeben" required>
			<br>
			<br>
			<label for="Alter">Alter:</label>
			<input type="number" name="Alter" id="Alter" placeholder="Ihr Alter eingeben" required>
			<br>
			<br>
			<label for="Wohnort">Wohnort:</label>
			<input type="text" name="Wohnort" id="Wohnort" placeholder="Ihren Wohnort eingeben" required>
			<br>
			<br>
			<label for="Passwort">Passwort:</label>
			<input id="Passwort" name="Passwort" type="password" placeholder="Ihr Passwort eingeben" required>
			<br>
			<br>
			<label for="E-Mail">E-Mail:</label>
			<input type="email" name="E-Mail" id="EMail" placeholder="Ihre E-Mail eingeben" required>
			<br>
			<br>
			<label for="Homepage">Homepage:</label>
			<input type="url" name="Homepage" id="Homepage" required>
			<br>
			<br>
			<label for="Telefonnummer">Telefonnummer:</label>
			<input type="tel" name="Telefonnummer" id="Telefonnummer" placeholder="Ihre Telefonnummer eingeben" required>
			<br>
			<br>
			<input type="reset" name="Zurücksetzen" id="Zurücksetzen" >
			<input type="submit" value="Absenden" >
		</form>
	</body>
</html>

Der Submit-Button befindet sich am Ende vom Code.

<input type="submit" value="Absenden" >

</form>

</body>

</html>

Habe in der Zwischenzeit etwas weitergeschrieben, sind aber nur ein paar mehr submit-Felder.

0
regex9  01.06.2022, 21:54
@CitrusApfel2

In deinem Code sind im Übrigen zwei Fehler.

  1. Das head-Element gehört in den html-Tag.
  2. Das der Wert des action-Attributs ist invalid. Wenn du keine explizite Adresse hast, lass das Attribut weg. Die Daten werden dann an die (vom Querystring natürlich abgesehen) selbe URL geschickt. Es ist zu hoffen, dass der Autor des Videos nicht noch weitere solcher Fehler in seinem Tutorial eingebaut hat.

Der unvollständige Doctype war sicherlich ein Kopierfehler.

1
CitrusApfel2 
Fragesteller
 01.06.2022, 22:01
@regex9

Wie meinst du in den html-Tag ?

Das mit dem Action-Attribut weiß ich, doch ich habe nichts mit JS, PHP oder SQL bzw. sonstiges anderes geschrieben. In dem Video wird erklärt dass wir es so lassen können.
Und was meinst du nochmal mit Der unvollständige Doctype war sicherlich ein Kopierfehler. ?

Danke!

0
regex9  01.06.2022, 22:40
@CitrusApfel2
Wie meinst du in den html-Tag ?
<!DOCTYPE html>
<html lang="de">
  <head>
    <!-- etc. ... -->
In dem Video wird erklärt dass wir es so lassen können.

Und das ist falsch. Entweder es wird eine valide URI angegeben:

<form action="/path/to/some/handler.php"><!-- ... --></form>

oder das Attribut wird komplett ausgelassen.

<form><!-- ... --></form>
1

Manchmal kann das Formular aufgrund von Server- oder Hosting-Problemen nicht ordnungsgemäß funktionieren. Überprüfe, ob Ihre Server-Einstellungen korrekt sind und ob es irgendwelche Einschränkungen gibt, die das Formular beeinträchtigen könnten. Es ist auch möglich, dass es aufgrund von Überlastung des Servers oder Problemen mit der Internetverbindung zu Verzögerungen oder Fehlern kommt. Ist das bei dir auch der Fall gewesen?

CitrusApfel2 
Fragesteller
 26.02.2023, 19:55

Ich hatte gar keine Server, ich glaube ich habe damals nur so ein Tutorial probiert.

0