HTML5 - Geavanceerde formulieren

Inhoudsopgave
De gegevenscodering instellen:
We weten dat de formulieren de gegevens die ze van de gebruiker verzamelen naar een nieuwe pagina of naar zichzelf sturen, via het http-protocol met behulp van een van de methoden zoals KRIJGEN of NA. Er zijn verschillende manieren om de gegevens te coderen om ze door te sturen http, zijn de mogelijke coderingstypen als volgt:
  • applicatie / x-www-form-urlencoded: Dit is de standaardmethode die wordt gebruikt, deze kan niet worden gebruikt om bestanden naar de server te uploaden.
  • meerdelige / formuliergegevens: Deze methode wordt gebruikt om bestanden naar de server te uploaden.
  • tekst / gewoon: Deze methode is afhankelijk van de browser, elk behandelt het anders.

Om het verschil tussen de methoden een beetje verder te zien, moeten we een formulier maken met ten minste twee velden, zodat we de verschillende gedragingen kunnen zien.
Laten we het formulier bekijken om te maken:
 Voorbeeld Stem insturen 

codering applicatie / x-www-form-urlencoded is degene die standaard wordt toegepast, dit is een codering voor algemeen gebruik die wordt gebruikt voor alles behalve het verwerken van bestandsuploads, de bijzonderheid ervan ligt in het feit dat het het URL-formaat gebruikt om de parameters door te geven, zodat ons formulier, wanneer het wordt ingediend, de volgende zou verzenden informatie:
 fave = Appels & naam = Leon + Ramirez 

We zien dat de waarden die door de gebruiker zijn ingevoerd, worden toegewezen aan de namen van onze velden, de speciale tekens worden vervangen door een equivalent in HTML-entiteit en we zien dat elk paar waarden wordt gescheiden door een & op deze manier weten we welk veld de volgende is.
codering meerdelige / formuliergegevens Het is veel complexer en verwerkt veel meer elementen, dit komt omdat het degene is die wordt gebruikt om bestanden te uploaden, dus het moet de informatie van een bestand als een afbeelding verzenden, en hiervoor heeft het deze structuur:
 ------ WebKitFormBoundary2qgCsuH4ohZ5eObF Inhoudsdispositie: formuliergegevens; name = "favoriet" Apple ------ WebKitFormBoundary2qgCsuH4ohZ5eObF Inhoudsdispositie: formuliergegevens; naam = "naam" Leon Ramirez ------ WebKitFormBoundary2qgCsuH4ohZ5eObF-- fave = Apple-naam = Leon Ramirez 

codering tekst / gewoonHet wordt door elke browser op een andere manier afgehandeld en wordt niet veel gebruikt, tenzij het een specifieke toepassing is in een gecontroleerde omgeving.
Attribuut automatisch aanvullen
Dit kenmerk is handig voor veel mensen die niet graag de meest herhaalde gegevens invoeren in een vorm zoals de naam en achternaam of e-mail, maar er zijn veel delicatere toepassingen zoals internetbankieren waar we maximale privacy nodig hebben bij de introductie van onze gegevens.
Om dit te controleren hanteren we het attribuut automatisch aanvullen, dit kan op formulierniveau zijn, of op het niveau van invoer, en heeft twee waarden Aan Y uit, dat wil zeggen aan of uit, zoals je misschien al hebt afgeleid wanneer het aan is Aan stelt de browser in staat om gegevens voor te stellen die de gebruiker eerder heeft ingevoerd in soortgelijke formulieren of in dezelfde vorm die hij bekijkt, en wanneer hij zich in uit geeft geen suggesties. Laten we de toepassing ervan bekijken aan de hand van twee zeer eenvoudige voorbeelden.
 Voorbeeld Stem insturen 

 Voorbeeld Stem insturen 

In ons eerste voorbeeld zien we hoe we het uit de hele vorm halen, en in het tweede voorbeeld zien we hoe we het ook uit de hele vorm halen, alleen in onze eerste invoer we activeren het, we kunnen ook het tegenovergestelde doen en het voor het hele formulier activeren en een bepaald veld deactiveren.
Hiermee sluiten we deze tutorial af, met de kennis om formulieren wat complexer te maken, naast weten hoe ze intern werken om de gegevens te verzenden.Vond je deze tutorial leuk en hielp je hem?Je kunt de auteur belonen door op deze knop te drukken om hem een ​​positief punt te geven

U zal helpen de ontwikkeling van de site, het delen van de pagina met je vrienden

wave wave wave wave wave