HTML-formulieren zijn een zeer krachtig hulpmiddel voor interactie met gebruikers, maar om technische redenen is het niet altijd duidelijk hoe ze optimaal kunnen worden gebruikt. Alleen het indienen van gegevens is in dit geval niet voldoende - u moet er ook voor zorgen dat de gegevens die gebruikers in formulieren invullen, worden verzonden in het juiste formaat dat nodig is voor een succesvolle verwerking en dat dit geen bestaande aanvragen verbreekt. Het is ook belangrijk om gebruikers te helpen formulieren correct in te vullen en niet gefrustreerd te raken wanneer ze applicaties proberen te gebruiken.
De tag wordt gebruikt om een HTML-formulier te maken. Het creëert niet echt een marge, maar wordt gebruikt als een bovenliggende container voor elementen zoals. Of u nu een eenvoudig abonnementsformulier wilt maken met regelmatig afrekenen en betalen, of interactieve webapplicaties, u zult HTML-elementtags moeten gebruiken om te werken, waarvan de belangrijkste. is
Hoe standaardHTML-formulieren
HTML-formulieren zijn uitgevonden en grotendeels gestandaardiseerd vóór de komst van asynchrone JavaScript en complexe webapplicaties. Tegenwoordig worden formulierinvoer, knoppen en andere interactiemechanismen gebruikt, maar de kern hiervan is een systeem dat is gebaseerd op het HTTP-verzoek- en antwoordparadigma.
Wanneer een gebruiker een pagina laadt, wordt een http-verzoek verzonden (meestal een zogenaamd GET-verzoek). Het wordt door uw browser naar de server gestuurd en meestal reageert de server met de webpagina waarnaar de gebruiker op zoek is. Deze interactie is een van de meest fundamentele concepten van internet. En dat verklaart precies hoe HTML-formulieren werken.
Het proces van het uitwisselen van informatie met de server
Elke, die elementen bevat zoals, bevindt zich binnenin en heeft een naamattribuut (naam), evenals zijn waarde. De waarde wordt op verschillende manieren gedefinieerd. Voor tekst is dit de waarde die door de sitegebruiker in het veld is ingevoerd. Voor een keuzerondje, de waarde van de geselecteerde optie. De gebruiker kan de waarde instellen, maar kan het kenmerk name meestal niet instellen. Dit creëert een set naam/waarde-paren waarbij de waarden worden bepaald door gebruikersinvoer.
Het belangrijkste verschil tussen een formulier en een gewoon HTML-document is dat in de meeste gevallen de gegevens die door een formulier worden verzameld, naar een webserver worden verzonden. In dit geval moet u een webserver instellen om gegevens te ontvangen en te verwerken. kenmerk actie tagspecificeert de locatie (URL) waar de verzamelde gegevens naartoe moeten worden gestuurd.
Hoe ziet de serverreactie eruit
Wanneer het formulier wordt verzonden, worden naam-waardeparen en alle velden binnen het element opgenomen in HTTP. Er wordt een verzoek gedaan aan de URL die is opgegeven in de vorm van het actiekenmerk. Het verzoektype (GET of POST) bevindt zich in het kenmerk method. Dit betekent dat alle door de gebruiker verstrekte gegevens naar de server worden verzonden zodra het formulier is ingediend, en de server kan met die gegevens doen wat hij wil. Wanneer de server een formulierinzending ontvangt, behandelt deze deze als elk ander HTTP-verzoek. De server doet wat hij moet doen met de meegeleverde gegevens en stuurt een reactie terug naar de browser.
Als je je herinnert dat het laden van de pagina de oplossing is, zul je merken dat hier hetzelfde gebeurt. In een typische vorm die met de tag is gemaakt, is het antwoord een nieuwe pagina die door de browser wordt geladen. Meestal vervangt de nieuwe pagina de huidige inhoud, maar dit kan worden overschreven met het doelkenmerk. De overgrote meerderheid van online formulieren werkt op deze manier, daarom wordt de gebruiker naar een bedankpagina gestuurd wanneer hij een e-mailabonnementsformulier invult.
Web-apps en formulieren zonder tag
Moderne interactieve webapplicaties gebruiken JavaScript-code om asynchrone http-verzoeken te doen. Dit zijn aanroepen naar de server die er niet voor zorgen dat de pagina opnieuw wordt geladen. Ze vertrouwen niet op een tag - een HTML-element dat in het gedrag is ingebouwd. Ze combineren niet alle gegevens tot één geheel.gebruiker en verzend ze niet onmiddellijk. Om deze reden gebruiken veel HTML + JS-lay-outontwerpers in webapplicaties de tag niet op alle formulieren. Vaker gebruiken ze het gewoon als een soort container voor verschillende soorten invoervelden en elementen. In dit geval zijn de gebruikte methode- en actieattributen niet zichtbaar.
Meer over formulieren
HTML-formulieren zijn een van de hoogtepunten van de interactie van een gebruiker met een website of applicatie. Hiermee kunnen gebruikers gegevens naar de site verzenden. Meestal worden de gegevens naar de webserver gestuurd, maar de webpagina kan deze ook onderscheppen om op zichzelf te gebruiken. Er zijn veel vormgerelateerde elementen - verschillende soorten knoppen, selectors voor verschillende typen, feedbackmechanismen. Daarom kan het moeilijk zijn om te beslissen welke waarden aan de tagkenmerken moeten worden toegewezen. Als het gaat om het maken van formulieren, moet u ze op verschillende schermformaten laten werken. Het is belangrijk om ze toegankelijk te maken voor mensen met een handicap. Dit is de reden waarom formulieren en attributentags misschien wel het meest complexe aspect van HTML zijn.
Waar bestaat de vorm uit
HTML-formulier bestaat uit een of meer widgets. Dit kunnen enkelregelige of meerregelige tekstvelden zijn, selectievakken, knoppen of keuzerondjes. Ze worden meestal geassocieerd met een attribuut dat hun doel beschrijft - correct geïmplementeerd kan zowel ziende als blinde gebruikers duidelijk instrueren hoe ze naar het invoerformulier kunnen gaan. Attribuutcorrect zijn gekoppeld aan respectievelijk hun for- en id-attributen. Het for-label verwijst dan naar het id-attribuut van de corresponderende widget, en de schermlezer die het gebruikt, zal voorlezen wat erin staat.
Naast de structuren die specifiek zijn voor de tag, is het belangrijk om te onthouden dat formulieren slechts HTML-code zijn. Dit betekent dat u de volledige kracht van HTML kunt gebruiken om uw formulieren te structureren. Een gebruikelijke praktijk is om de tag te gebruiken om elementen die zijn getagd metin te pakken
. HTML-lijsten worden ook veel gebruikt; meerdere selectievakjes of keuzerondjes worden gebruikt voor het structureren. Na het maken van de invoervelden, blijft het om een knop toe te voegen met behulp van de tag en het resultaat te controleren. De flexibiliteit van HTML-formulieren maakt ze een van de meest complexe structuren in het HTML-formaat. Maar met de juiste structuur bij het bouwen van een HTML-formulier, kunt u ervoor zorgen dat het zowel bruikbaar als toegankelijk is.