Cum se adaugă un formular cu KompoZer

01 din 06

Adăugați un formular cu KompoZer

Adăugați un formular cu KompoZer. Screen shot împuternicit Jon Morin

Există de multe ori când creați pagini web în care trebuie să procesați datele introduse de utilizator, cum ar fi o pagină de conectare, crearea unui cont nou sau să trimiteți întrebări sau comentarii. Intrarea utilizatorului este colectată și trimisă pe serverul web utilizând un formular HTML. Formularele sunt ușor de adăugat împreună cu instrumentele integrate ale KompoZer. Toate tipurile de câmpuri care suportă HTML 4.0 pot fi adăugate și editate cu KompoZer, dar pentru acest tutorial vom lucra cu butoanele textului, textului, trimiterii și resetării.

02 din 06

Creați un nou formular cu KompoZer

Creați un nou formular cu KompoZer. Screen shot împuternicit Jon Morin

KompoZer are instrumente bogate de formă pe care le puteți utiliza pentru a adăuga formulare paginilor dvs. web. Accesați instrumentele de formular făcând clic pe butonul Form sau pe meniul derulant din bara de instrumente. Rețineți că dacă nu vă scrieți propriile scripturi de manipulare a formularului , va trebui să obțineți câteva informații pentru acest pas din documentație sau de la programatorul care a scris scenariul. De asemenea, puteți utiliza formularele mailto, dar acestea nu funcționează întotdeauna .

  1. Poziționați cursorul în locația în care doriți să apară formularul dvs. pe pagină.
  2. Faceți clic pe butonul Form din bara de instrumente. Se deschide caseta de dialog Proprietăți formulari.
  3. Adăugați un nume pentru formular. Numele este utilizat în codul HTML generat automat pentru a identifica formularul și este necesar. De asemenea, trebuie să salvați pagina înainte de a adăuga un formular. Dacă lucrați cu o pagină nouă, nesalvată, KompoZer vă va solicita să salvați.
  4. Adăugați URL-ul în scriptul care va procesa datele formularului în câmpul URL de acțiune. Formularele de formular sunt, de obicei, scripturi scrise în PHP sau în limbi similare de pe server. Fără aceste informații, pagina dvs. web nu va putea face nimic cu datele introduse de utilizator. KompoZer vă va solicita să introduceți adresa URL a formatorului, dacă nu îl introduceți.
  5. Selectați metoda folosită pentru a trimite datele formularului la server. Cele două opțiuni sunt GET și POST. Veți avea nevoie să știți ce metodă necesită scriptul.
  6. Faceți clic pe OK și formularul este adăugat la pagina dvs.

03 din 06

Adăugați un câmp text la un formular cu KompoZer

Adăugați un câmp text la un formular cu KompoZer. Screen shot împuternicit Jon Morin

Odată ce ați adăugat un formular la o pagină cu KompoZer, formularul va fi prezentat pe pagină într-o linie întreruptă cu albastru deschis. Adăugați câmpurile de formular în interiorul acestei zone. Puteți, de asemenea, să introduceți text sau să adăugați imagini, la fel ca în orice altă parte a paginii. Textul este util pentru a adăuga instrucțiuni sau etichete pentru a forma câmpuri pentru ghidarea utilizatorului.

  1. Alegeți unde doriți câmpul de text să meargă în zona de formă prezentată. Dacă doriți să adăugați o etichetă, vă recomandăm să introduceți mai întâi textul.
  2. Dați clic pe săgeata în jos de lângă butonul Form din bara de instrumente și alegeți câmpul Form din meniul derulant.
  3. Fereastra Proprietăți câmp Formular se va deschide. Pentru a adăuga un câmp de text, selectați Text din meniul derulant cu eticheta Tip de câmp.
  4. Dă un nume câmpului de text. Numele este utilizat pentru a identifica câmpul în codul HTML, iar scriptul de manipulare a formularului are nevoie de numele pentru prelucrarea datelor. Un număr de alte atribute opționale pot fi modificate în acest dialog prin comutarea butonului Mai multe proprietăți / Mai puține proprietăți sau prin apăsarea butonului Advanced Edit, dar pentru moment vom introduce doar numele câmpului.
  5. Faceți clic pe OK, iar câmpul text apare pe pagină.

04 din 06

Adăugați o zonă de text la un formular cu KompoZer

Adăugați o zonă de text la un formular cu KompoZer. Screen shot împuternicit Jon Morin

Uneori, o mulțime de text trebuie introdusă într-un formular, cum ar fi un mesaj sau un câmp de întrebări / comentarii. În acest caz, un câmp text nu este adecvat. Puteți adăuga un câmp de formă a zonei de text utilizând instrumentele de formular.

  1. Poziționați cursorul în conturul formularului în care doriți să fie zona dvs. de text. Dacă doriți să introduceți o etichetă, este adesea o idee bună să introduceți textul etichetei, să apăsați pe Enter pentru a vă deplasa la o linie nouă, apoi să adăugați câmpul de formular, deoarece dimensiunea zonei de text de pe pagină o face neplăcută pentru eticheta să fie pe partea stângă sau pe dreapta.
  2. Dați clic pe săgeata în jos de lângă butonul Form din bara de instrumente și alegeți Zona text din meniul derulant. Fereastra Text Area Properties se va deschide.
  3. Introduceți un nume pentru câmpul pentru zona textului. Numele identifică câmpul din codul HTML și este utilizat de scriptul de manipulare a formularului pentru procesarea informațiilor trimise de utilizator.
  4. Introduceți numărul de rânduri și coloane pe care doriți să le afișeze zona de text. Aceste dimensiuni determină dimensiunea câmpului din pagină și cât de mult text poate fi introdus în câmp înainte ca derularea să aibă loc.
  5. Mai multe opțiuni avansate pot fi specificate cu celelalte controale din această fereastră, dar pentru moment, numele câmpului și dimensiunile sunt suficiente.
  6. Faceți clic pe OK și zona de text apare pe formular.

05 din 06

Adăugați un buton de trimitere și resetare la un formular cu KompoZer

Adăugați un buton de trimitere și resetare la un formular cu KompoZer. Screen shot împuternicit Jon Morin

După ce utilizatorul a completat formularul de pe pagina dvs., trebuie să existe o modalitate de transmitere a informațiilor către server. În plus, dacă utilizatorul dorește să înceapă sau să facă o greșeală, este util să includeți un control care va reseta valorile formularului la valorile implicite. Controalele de formă speciale gestionează aceste funcții, numite, respectiv, butoanele Trimitere și Resetare.

  1. Plasați cursorul în zona de formă prezentată unde doriți să fie butonul de trimitere sau de resetare. Cel mai adesea, acestea se vor afla sub restul câmpurilor dintr-un formular.
  2. Dați clic pe săgeata în jos de lângă butonul Form din bara de instrumente și alegeți butonul Definire din meniul derulant. Se va afișa fereastra Buton Proprietăți.
  3. Alegeți tipul de buton din meniul derulant etichetat Tip. Alegerile tale sunt Submit, Reset și Button. În acest caz, vom alege tipul de trimitere.
  4. Dați un nume butonului, care va fi utilizat în codul HTML și codul de manipulare a formularului pentru a procesa solicitarea de formular. Dezvoltatorii web numesc de obicei acest câmp "trimiteți".
  5. În caseta cu eticheta Valoare, introduceți textul care ar trebui să apară pe buton. Textul trebuie să fie scurt, dar descriptiv pentru ceea ce se va întâmpla atunci când butonul este apăsat. Ceva ca "Trimiteți", "Trimiteți formularul" sau "Trimiteți" sunt exemple bune.
  6. Faceți clic pe OK, iar butonul apare pe formular.

Butonul Reset poate fi adăugat la formular folosind același proces, dar alegeți Resetați din câmpul Tip în loc de Submit.

06 din 06

Editarea unui formular cu KompoZer

Editarea unui formular cu KompoZer. Screen shot împuternicit Jon Morin

Editarea unui câmp de formă sau de formular în KompoZer este foarte ușoară. Pur și simplu faceți dublu clic pe câmpul pe care doriți să-l editați și apare caseta de dialog corespunzătoare unde puteți schimba proprietățile câmpului pentru a vă potrivi nevoilor. Diagrama de mai sus prezintă o formă simplă, utilizând componentele acoperite de acest tutorial.