Antwort an „Rolf B“ verfassen

Hallo Samuel,

wer sich anbietet, erntet Kommentare 😉. Meine eigenen Beispiele mutieren auch immer einige Zeit lang vor sich hin, bis sie mir und anderen gefallen.

Nachdem ich deine Begründung für type="button" gelesen habe, fällt mir noch was auf.

Ein Form ohne Submit ist - meine ich - nicht so sinnvoll. Man kann aber, statt gar keinen Submit-Button zu haben, sich auf das submit-Event des Forms registrieren und im Submit-Handler mit event.preventDefault() den echten Submit unterbinden.

Ich würde das JS für das Beispiel dann so strukturieren:

document.addEventListener("DOMContentLoaded", function() {
	const formElement = document.forms.urlForm;
        
  // Submit auf Form abfangen
  formElement.addEventListener("submit", (submitEvent) => {
    // Echten Submit verhindern
    submitEvent.preventDefault();
    // URL erzeugen und im Link ablegen
    generateURL();     
  });

  function generateURL() {
  ...
  }
});

Den DOMContentLoaded-Rahmen lässt man im Wiki-Artikel weg.

Diese Variante verwendet im HTML dann nur noch

<button>Download-URL generieren</button>

Die anonyme Funktion, die den Submit-Handler bildet, kümmert sich um das Stoppen des Submit. Das ist "single responsibility" - eine Funktion hat die Ablaufsteuerung, die andere Funktion bestückt den Link.

In generateURL kannst Du formElement nutzen und auch dessen Komfortfunktionen verwenden, also z.B. formElement.input_text ansprechen statt mit getElementById("input_text") zu hantieren. Das Link-Element kriegst Du so nicht erreicht, a Elemente sind keine Formelemente und tauchen darum in der elements-Collection eines Forms nicht auf.

Das ist jetzt nur eine Anregung, kein Auftrag. Mein Fiddle sieht so aus: https://jsfiddle.net/Rolf_b/6qh4yrwe/. Die textarea hat bei mir box-sizing:border-box, weil eine textarea per Default padding und border hat und deswegen width:100% ohne das box-sizing zu breit ist. Und Gunnars Flexbox-Idee für den p Container hab ich aufgegriffen.

Rolf

--
sumpsi - posui - obstruxi
freiwillig, öffentlich sichtbar
freiwillig, öffentlich sichtbar
freiwillig, öffentlich sichtbar

Ihre Identität in einem Cookie zu speichern erlaubt es Ihnen, Ihre Beiträge zu editieren. Außerdem müssen Sie dann bei neuen Beiträgen nicht mehr die Felder Name, E-Mail und Homepage ausfüllen.

abbrechen