Opprett kontaktskjema ved hjelp av HTML og PHP

Kontaktskjema er en veldig viktig del av ethvert nettsted. Besøkende på nettstedet må kommunisere med nettstedseieren for forskjellige formål. Ved å bruke kontaktskjemaet sender besøkende meldinger til administratoren eller eieren av nettstedet med kontaktinformasjonen. Administratoren eller eieren av nettstedet kan svare på besøkende etter å ha lest og vurdert viktigheten av budskapet deres. Du kan opprette et kontaktskjema for ethvert nettsted på forskjellige måter. Hvordan du kan lage et enkelt kontaktskjema og responsiv kontaktskjema ved å bruke HTML, CSS, Bootstrap og PHP har blitt vist i denne opplæringen.

Enkel kontaktskjema

Måten å designe et enkelt kontaktskjema ved å bruke HTML, CSS og PHP er vist i denne delen av opplæringen.

HTML og CSS -kode:

Opprett en PHP -fil som heter simple_contact_form.PHP med følgende skript for å vise kontaktskjemaet ved å bruke bare HTML og CSS. PHP -skriptet vil bli lagt til senere for å validere skjemaet og vise det innsendte skjemadata.

KONTAKT SKJEMA

Navn


E -post


Beskjed

Nå, løp simple_contact_form.PHP fil fra serveren. Følgende utgang vises etter å ha utført skriptet.

Les, validerer og skriv ut skjemaets data ved hjelp av PHP

Legg nå til følgende PHP -skript i begynnelsen av Simple_Contact_Form.PHP -fil for å validere skjemadata, lese skjema data og skrive ut dataene på nettleseren. Når brukeren vil klikke på Send -knappen, vil skjemadataene bli sjekket for validering ved å bruke PHP -skript. Hvis de innsendte dataene blir validert, vil dataene bli skrevet ut i nettleseren.

PHP -kode:

Legg til følgende PHP -kode i begynnelsen av simple_contact_form.PHP fil.

$ name = "";
$ nameerr = "";
$ e -post = "";
$ e -postr = "";
$ melding = "";
$ messageerr = "";
$ feil = falsk;
/ * Kontroller nødvendige felt */
if (isset ($ _ post ['send']))

$ name = $ _post ['name'];
$ e -post = $ _post ['e -post'];
$ melding = $ _post ['melding'];
if ($ name == "")

$ nameerr = "felt kan ikke være tomt.";
$ feil = sant;

ellers if (strlen ($ navn) < 3)

$ nameerr = "navn skal være mer enn 2 tegn.";
$ feil = sant;

ellers

$ nameerr = "";

if ($ e -post == "")

$ e -postR = "Felt kan ikke være tomt.";
$ feil = sant;

eller hvis (!filter_var ($ e -post, filter_validate_email))

$ e -postR = "Ugyldig e -postadresse.";
$ feil = sant;

ellers

$ e -postr = "";

if ($ melding == "")

$ messageerr = "felt kan ikke være tomt.";
$ feil = sant;

ellers if (strlen ($ melding) < 10)

$ messageerr = "melding skal være mer enn 9 tegn.";
$ feil = sant;

ellers

$ messageerr = "";

if ($ error == falsk)

$ name = $ name;
$ til = '[email protected] ';
$ fra = $ e -post;
$ emne = 'henvendelse';
$ body = 'hei,

'.$ melding.'

Takk,
'.$ navn;
ekko "til:".$ til.""
Fra: ".$ fra.""
Emne: ".$ emne.""

---

"".$ kropp;


hvis(!Isset ($ _ Post ['Send']) || $ feil == true)

?>

Legg til følgende PHP -kode på slutten av simple_contact_form.PHP fil.

?>

Hvis skjemaet sendes inn ved å holde alle felt tomt, vil følgende utgang vises.

Hvis skjemaet sendes inn ved å skrive mindre enn 9 tegn i meldingsfeltene, vil følgende utgang vises.

Hvis skjemaet sendes inn med alle gyldige data, vil følgende utdata vises.

Ved å bruke kodene ovenfor kan du enkelt lage et veldig enkelt kontaktskjema for nettstedet ditt. Men denne skjemaet er ikke et responsivt kontaktskjema. Måten å gjøre dette skjemaet responsivt på har blitt vist i neste del av denne opplæringen.

Responsiv kontaktskjema

De fleste nettsteder er designet med responsive funksjoner nå. Måten å konvertere det tidligere opprettede enkle kontaktskjemaet til et responsivt kontaktskjema ved å bruke bootstrap er vist i denne delen av opplæringen.

HTML -kode:

Opprett en PHP -fil som heter Responsive_contact_form.PHP med følgende skript for å vise det responsive kontaktskjemaet ved å bruke HTML og Bootstrap. PHP -skriptet vil bli lagt til senere for å validere skjemaet og vise det innsendte skjemadata.

>