Det er mange ganger når du oppretter nettsider der du må behandle innspill fra brukeren, for eksempel en påloggingsside, ny kontoopprettelse, eller å sende inn spørsmål eller kommentarer. Brukerinngang samles inn og sendes til webserveren ved hjelp av et HTML-skjema. Skjemaer er enkle å legge til med KompoZer sine innebygde verktøy. Alle formfelttyper som HTML 4.0 støtter kan legges til og redigeres med KompoZer, men for denne opplæringen vil vi jobbe med teksten, tekstområdet, sende inn og tilbakestille knapper.
Opprett en ny skjema
KompoZer har rike skjermverktøy som du kan bruke til å legge til skjemaer på websidene dine. Du får tilgang til skjemaverktøyene ved å klikke på Form-knappen eller den tilhørende rullegardinmenyen på verktøylinjen. Merk at hvis du ikke skriver dine egne skjemahåndteringsskript, må du få informasjon om dette trinnet fra dokumentasjon eller fra programmøren som skrev skriptet. Du kan også bruke mailto skjemaer, men de jobber ikke alltid.
- Plasser markøren på stedet du ønsker at skjemaet ditt skal vises på siden.
- Klikk på Form knappen på verktøylinjen. Dialogboksen Formegenskaper åpnes.
- Legg til et navn på skjemaet. Navnet brukes i den automatisk genererte HTML-koden for å identifisere skjemaet og kreves. Du må også lagre siden din før du kan legge til et skjema. Hvis du jobber med en ny, ikke-lagret side, vil KompoZer be deg om å lagre.
- Legg til nettadressen til skriptet som vil behandle skjemadataene i feltet Handling URL. Form håndterer er vanligvis skript skrevet i PHP eller lignende server-side språk. Uten denne informasjonen kan ikke websiden din gjøre noe med dataene som er oppgitt av brukeren. KompoZer vil be deg om å skrive inn nettadressen for skjemahåndtereren hvis du ikke skriver inn den.
- Velg Metode pleide å sende formdata til serveren. De to valgene er GET og POST. Du må vite hvilken metode skriptet krever.
- Klikk OK og skjemaet er lagt til på siden din.
Legg til et tekstfelt i et skjema
Når du har lagt til et skjema på en side med KompoZer, vil skjemaet bli skissert på siden i en lyseblå strekk linje. Du legger til skjemafeltene dine i dette området. Du kan også skrive inn tekst eller legge til bilder, akkurat som du ville på noen annen side av siden. Tekst er nyttig for å legge til meldinger eller etiketter for å danne felt for å veilede brukeren.
- Velg hvor du vil at tekstfeltet skal gå i det angitte formområdet. Hvis du vil legge til en etikett, kan du skrive inn teksten først.
- Klikk på pil ned ved siden av Form knappen på verktøylinjen og velg Formularfelt fra rullegardinmenyen.
- Vinduet Formfeltegenskaper åpnes. For å legge til et tekstfelt, velg Tekst fra rullegardinmenyen merket Feltype.
- Gi et navn til tekstfeltet. Navnet brukes til å identifisere feltet i HTML-koden, og skjermhåndteringsskriptet trenger navnet til å behandle dataene. En rekke andre valgfrie attributter kan endres på denne dialogen ved å bytte til Flere eiendommer / færre eiendommer knappen eller ved å trykke på knappen Avansert redigering, men for nå vil vi bare skrive inn feltnavnet.
- Klikk OK og tekstfeltet vises på siden.
Legg til et tekstområde i et skjema
Noen ganger må mye tekst angis på et skjema, for eksempel et melding eller et spørsmål / kommentarfelt. I dette tilfellet er et tekstfelt bare ikke passende. Du kan legge til et tekstområdeformularfelt ved hjelp av skjemaverktøyene.
- Plasser markøren i skjemaoversikten der du vil at tekstområdet ditt skal være. Hvis du vil skrive inn en etikett, er det ofte en god idé å skrive inn etikettteksten, trykk enter for å flytte til en ny linje, og legg deretter til skjemafeltet, siden størrelsen på tekstområdet på siden gjør det vanskelig for etikett til venstre eller høyre.
- Klikk på pil ned ved siden av Form knappen på verktøylinjen og velg Tekst Område fra rullegardinmenyen. Egenskapsvinduet Tekstområde åpnes.
- Skriv inn et navn for tekstfeltet. Navnet identifiserer feltet i HTML-koden og brukes av skjemahåndteringsskriptet for å behandle den brukerdefinerte informasjonen.
- Skriv inn antall rader og kolonner som du vil at tekstområdet skal vises på. Disse dimensjonene bestemmer størrelsen på feltet på siden og hvor mye tekst som kan skrives inn i feltet før rulling må skje.
- Flere avanserte alternativer kan angis med de andre kontrollene i dette vinduet, men for øyeblikket er feltnavn og dimensjoner nok.
- Klikk OK og tekstområdet vises på skjemaet.
Legg til en Send og Tilbakestill-knapp til et skjema
Etter at brukeren har fylt ut skjemaet på siden din, må det være noen måte at informasjonen skal sendes til serveren. I tillegg, hvis brukeren ønsker å starte over eller gjør en feil, er det nyttig å inkludere en kontroll som vil tilbakestille alle formverdiene til standardinnstillingen. Spesielle skjermkontroller håndterer disse funksjonene, kalt henholdsvis Submit og Reset-knappene.
- Plasser markøren innenfor det skisserte formområdet hvor du ønsker at innleverings- eller tilbakestillingsknappen skal være. Ofte vil disse bli plassert under resten av feltene på et skjema.
- Klikk på pil ned ved siden av Form knappen på verktøylinjen og velg Definer knapp fra rullegardinmenyen. Knappegenskaper-vinduet vises.
- Velg type knapp fra rullegardinmenyen merket Type. Dine valg er Send, Tilbakestill og Knapp. I dette tilfellet velger vi Sende inn type.
- Gi et navn til knappen, som vil bli brukt i HTML og formhåndteringskoden for å behandle skjemaforespørselen. Webutviklere nevner vanligvis dette feltet "submit."
- I boksen merket Verdi, skriv inn teksten som skal vises på knappen. Teksten skal være kort, men beskrivende av hva som vil skje når knappen trykkes. Noe som "Send", "Send form" eller "Send" er gode eksempler.
- Klikk på OK, og knappen vises på skjemaet.
De tilbakestille knappen kan legges til skjemaet ved hjelp av samme prosess, men velg tilbakestille fra Type feltet i stedet for Sende inn.
Redigerer et skjema med KompoZer
Å redigere et skjema eller skjemafelt i KompoZer er veldig enkelt. Dobbeltklikk bare på feltet du vil redigere, og den riktige dialogboksen vises der du kan endre feltegenskaper som passer dine behov. Diagrammet ovenfor viser en enkel form ved hjelp av komponentene dekket i denne opplæringen.
