HTML -skjemaer
Fundamentals of HTML Forms
Her vil vi se etter byggesteinene til HTML -formelementer og deres respektive attributter. Så la oss grave i dem:
HTML Formelement
Denne taggen er basen av HTML -skjemaer og brukes til å ta det første trinnet for å lage HTML -skjemaer. Følgende syntaks refererer til skjemakoden:
Elementene i form vil bli diskutert i de kommende seksjonene. Her presenterer vi attributetabellen som støttes av HTML -skjemaelementet.
| Attributter til HTML -formelement | ||
|---|---|---|
| Attributter | Verdi (er) | Beskrivelse |
| handling | Dette definerer plasseringen/filen der skjemadataene vil bli sendt inn | |
| mål | Det brukes til å vise responsen etter innlevering av skjema | |
| _selv | Gjeldende vindu | |
| _topp | Full ramme av det nåværende vinduet | |
| _Parent | Foreldramme | |
| _blank | Nytt vindu | |
| Metode | Definerer HTTP -metoden for å sende inn skjemaet | |
| FÅ | Det er standardmetoden som brukes til å be om data fra serveren | |
| POST | Brukes til å sende data til serveren | |
| Autofullfør | på | Gjenbruk av skjemaet vil autofill feltene |
| Novalidat | Skjemaets data vil ikke bli validert ved innsending | |
Tabellen ovenfor har oppsummert alle attributtene som støttes av formelementet. La oss utforske elementer av HTML -skjemaer.
HTML -etikettelement
Dette elementet definerer etiketten for HTML -formelementer for å vise formålet/beskrivelsen av det elementet på brukerens skjerm. Selv om det ikke er et nødvendig element for å lage HTML -skjemaer, anbefales det imidlertid å legge til dette elementet som det hjelper med å veilede brukerne.
Syntaksen til etikett -taggen er beskrevet nedenfor
De Navn representerer verdien som vil vises på brukerens skjerm, og den godtar et attributt som er navngitt til som inneholder referansen til id attributt til inngangselementet.
HTML inngangselement
Inngangselementet regnes som kjerneelementet i en HTML -form. Syntaksen gitt nedenfor refererer til inngangselementet:
Funksjonaliteten til inndatakoden avhenger av attributtene og deres verdier. Vi har listet opp de viktige attributtene til HTML -inngangselementet.
| Attributter til inngangselementet | ||
|---|---|---|
| Attributter | Verdi (er) | Beskrivelse |
| id | Angir identifikatoren for anerkjennelse | |
| Verdi | Angir initialverdien av inngangsfeltet | |
| Navn | Brukes til å sende inn dataene fra inputelementet | |
| readonly | Brukes til å begrense tekstfeltet til skrivebeskyttet | |
| maks lengde | Brukes til å definere det maksimale antall tegn i et inngangsfelt | |
| min | Brukes til å angi minimumsverdien for antall, dato, rekkevidde, måned osv., | |
| Maks | Maksimal verdi på antall, dato, rekkevidde, måned, etc., | |
| Flere | Denne attributtet gjør det mulig å oppgi flere e -postadresser eller legge ved flere filer | |
| påkrevd | Må fylles før innsending | |
| stedholder | Dummy -tegnene som allerede er til stede i inngangsfeltet | |
| type | Brukes til å sette inn data avhengig av verdiene | |
| tekst | Enkelt tekstfelt for å sette inn data | |
| knapp | Opprett en knapp | |
| passord | Angi et passordfelt | |
| sende inn | Send inn knapp for å sende inn skjemaet | |
| nullstille | Tilbakestill -knappen for å tilbakestille alle verdier | |
| radio | For å opprette en alternativknapp | |
| avkrysningsrute | For å lage en avkrysningsrute | |
| farge | Å sette en farge på tekstfeltet | |
| Dato | Lag et datofelt | |
| e -post | For å opprette et tekstfelt for å få e -postadresse | |
| fil | Et filutvalgsfelt vil bli opprettet for å få filen | |
| skjult | Et felt som bare er synlig for utvikleren | |
| måned | Å velge måned og år | |
| Antall | Oppretter et felt som godtar numeriske verdier | |
| Tlf | For å sette inn et telefonnummer | |
| URL | Brukes til å lage et felt som inneholder URL | |
Attributtene gitt i tabellen viser at inngangselementet har en nøkkelrolle i å lage HTML -skjemaer.
HTML TextArea Element
Inngangselementet lar deg sette inn et tekstfelt med en linje. Imidlertid, hvis du vil opprette tekstfelt med flere linjer, må du bruke tag ved å bruke følgende syntaks:
Dette elementet godtar tre attributter, rader, Cols, og Navn. Radene og Cols attributtet til å angi høyde og bredde av attributtet mens Navn Attributt brukes til å gjenkjenne tekstområdet av serveren.
Fra diskusjonen ovenfor ville du gått gjennom byggesteinene til HTML -skjemaer. La oss øve dem for å lage et eksempel på HTML -skjema.
Hvordan lage en HTML -skjema
Denne delen praktiserer noen få eksempler som lager HTML -skjemaer i forskjellige scenarier.
Eksempel
Koden gitt nedenfor oppretter en HTML -skjema ved å bruke skjemaelementet ved siden av inngangs- og etikettelementer.
Beskrivelsen av koden er som følger:
- Et formelement erklært å starte kroppen som blir fulgt av etiketten, inngangs- og tekstområdet elementer.
- To etikettelementer refererer til to inngangselementer som skal få navn og e -post til brukeren. Dessuten representerer det siste etikettelementet.
- Til slutt opprettes en knapp ved hjelp av innsendingstypen til inngangselementet.
Produksjon
For en bedre forståelse av utdataene har vi fremhevet området der etiketten, inngangen, tekstområdet og sendeknappene er opprettet.
Konklusjon
Skjemaer i HTML brukes til å samle inn data fra brukeren. Det kan være til ethvert formål som kundeinformasjon, registrering, tilbakemelding, kommentarer osv. En HTML -skjema kan omfatte forskjellige tekstfelt, radioknapper, avmerkingsbokser, e -postfelt og mange flere. Vi har gitt de grunnleggende elementene i HTML -former, og sistnevnte brukes disse elementene også for å lage en HTML -form.