HTML seite läd beim klicken eines einzelnen Buttons immer neu

[NoGamerNo]

hallo, ich bin anfänger mit dem programmieren und versuche grade aus einem tutorial eine todo liste nachzu bauen, habe auch alles schritt für schritt nachgebaut das problem ist das wenn ich eine sache zur liste hinzufügen will der punkt auftaucht und dann die seite neu lädt und alles wieder leer ist, beim dem video funktioniert es aber einwandfrei,

danke schonmal im vorraus

LG

[Matthias Scharwies]

Servus!

hallo, ich bin anfänger mit dem programmieren und versuche grade aus einem tutorial eine todo liste nachzu bauen, habe auch alles schritt für schritt nachgebaut das problem ist das wenn ich eine sache zur liste hinzufügen will der punkt auftaucht und dann die seite neu lädt und alles wieder leer ist, beim dem video funktioniert es aber einwandfrei,

Ist das ein Formular mit einem Absende-Button? Das ist das Standardverhalten eines HTML-Formulars.

Entweder unterdrückst du das mit preventDefault (JavaScript) oder du gibst dem Button ein type="button". Ohne type-Attribut ist er vom default-Wert type="submit".

HTML/Tutorials/Formulare/Was_ist_ein_Webformular?

Herzliche Grüße

Matthias Scharwies

[Matthias Scharwies]

Servus!

HTML/Tutorials/Formulare/Was_ist_ein_Webformular?

moin also um ehrlich zu sein habe ich keine ahnung was du genau meinst😂

ich zeig dir einfach den code...

<form onsubmit="addTodo()">
 <div class="mdl-textfield mdl-js-textfield mdl-textfield--floating-label">
    <input class="mdl-textfield__input" type="text" id="todofield">
    <label class="mdl-textfield__label" for="todofield">To Do</label>
 </div>

 <!-- Colored raised button -->
 <button class="mdl-button mdl-js-button mdl-button--raised mdl-button--colored">
        Speichern
 </button>
</form>

Du hast ein Formular mit einem Absende-Button! Der hat kein type=Attribut. Ohne type-Attribut ist er vom default-Wert type="submit".

form onsubmit="AddToDo()" schickt das Formular ab - sollte man eher mit addEventListener realisieren.

HTML/Tutorials/Formulare/Was ist ein Webformular?

Herzliche Grüße

Matthias Scharwies

[Rolf B]

Hallo NoGamerNo,

es wäre hilfreich, wenn Du das Tutorial verlinken könntest und uns auch einen Link auf deine Testseite gibst. Dann kann man sich das im Ganzen anschauen. Andernfalls müssen wir unsere Glaskugeln benutzen, um dir zu helfen, und was mit denen los ist, hat Gunnar deutlich gesagt und für Auges Vorschlag hat keiner das Geld.

Was Du da baust, ist offenbar eine JavaScript Lösung, die die Todo-Liste ohne Serverkontakt im Browser aufbaut. Schön. Aber dann müssten wir auch das JavaScript zu sehen bekommen.

Die addTodo-Funktion wird beim Submit des Forms aufgerufen, weswegen es nicht falsch sein muss, den Button ohne expliziten type zu erstellen. Die addTodo-Funktion muss dann, wie Matthias schrieb, den Submit per preventDefault stoppen, sonst geht er zum Server und die Seite lädt neu.

Dein Tutorial löst das offenbar irgendwie. Aber "irgendwie" hilft uns irgendwie nicht dabei weiter, was Du irgendwie andersmachst.

Hilf uns dabei, Dir zu helfen.

Rolf