330 likes | 461 Views
Marrja e te inputit te perdoruesit. Leksion 10. Format ne Web. Tagu FORM Cfare ndodh kur dergoni nje forme ne HTML? Perdoruesi ploteson kutite e tekstit dhe klikon nje buton submit. Me pas ky informacion i dhene nga perdoruesi paketohet dhe dergohet ne web server.
E N D
Marrja e te inputit te perdoruesit Leksion 10
Format ne Web • Tagu FORM • Cfare ndodh kur dergoni nje forme ne HTML? • Perdoruesi ploteson kutite e tekstit dhe klikon nje buton submit. • Me pas ky informacion i dhene nga perdoruesi paketohet dhe dergohet ne web server. • Web serveri e merr kete informacion dhe furnizon me te, motorin e skriptit te PHP-se. • PHP perpunon kete informacion dhe e kthen ate mbrapsht si pjese te pergjigjes HTTP. • Per te ndertuar nje forme ne HTML perdorim taget <FORM> </FORM> dhe çdo kontroll qe ndodhet brenda ketyre tageve, si psh kutite e tekstit, check boxet, dhe butonat radio, behen automatikisht pjese e formes qe dergohet ne web server. • Atributet e FORM • Tagu <FORM> ka nje bashkesi atributesh nder te cilet, ne do te perdorim ACTION and METHOD.
Format ne Web • ACTION • Atributi ACTION i tregon serverit se ne cilen faqe duhet te shkoje, pasi perdoruesi klikon nje buton submit ne forme. Nuk ka rendesi nese kjo faqe eshte HTML e thjeshte, PHP apo nese perdor ndonje teknologji server-side, per sa kohe qe faqja ekziston ne web server. Ai mund te perdoret per t’u lidhur me nje faqe HTML, si me poshte: • <FORM ACTION="test.html"> • ... • </FORM> Ose , per nje faqe PHP: • <FORM ACTION="test.php"> • ... • </FORM>
Format ne Web • Megjithate, kur vendosim nje faqe PHP si pjese te atributit ACTION, ajo çfare bejme ne te vertete eshte dergimi i informacioneve te futura ne forme, ne interpretuesin e skripteve te PHP-se, per t’u perpunuar. • Atributi ACTION thjesht i tregon serverit ne cilen faqe te shkoje me pas. Nese e ruani faqen e mesiperme si test.html ne vend te test.php, atehere faqja nuk do te dergohej ne interpretuesin e PHP-se dhe asgje nuk do te shfaqet po te mos konfigurohet PHP per te interpretuar (parse) skedaret .html.
Format ne Web • METHOD • Atributi METHOD kontrollon menyren se si informacioni dergohet ne server. Kete mund ta beje ne dy menyra. Keto jane metodat GET and POST dhe perdoren si me poshte: • <FORM ACTION="test.php" METHOD=GET> • ose • <FORM ACTION="test.php" METHOD=POST>
GET • Metoda GET i tregon browserit qe te shtoje ne URL vlerat qe perdoruesi vendosi ne forme. • Per kete browseri shton nje pikepyetje (?) ne fund te URL-se per te treguar se ku mbaron URL-ja dhe ku fillon informacioni i formes. • Me pas informacioni i formes transmetohet ne formen e çifteve emer/vlere. • Nje çift emer/vlere punon ne menyre te ngjashme me nje variabel. Pjesa e pare eshte emri, i cili vepron si nje identifikues. Pjesa e dyte eshte vlera qe doni te ruani. Psh: • ?animal=cat • Ketu "animal“ eshte emri, ndersa "cat" eshte vlera. Kjo mund t’i shtohet URL-se si vijon: • http://www.nonexistentserver.com/test.php?animal=cat
GET • Browseri shton automatikisht informacionin ne URL kur dergon kerkesen e faqes ne web server. Ne URL mund te shtoni me shume se nje çift emer/vlere nese çdo çift e ndani me nje ampersand (&).Psh: • http://www.nonexistentserver.com/test.php?furryanimal=cat&spikyanimal=porcupine • Pjesa e shtuar ne URL njihet si nje query string. • Thame qe çiftet emer/vlere jane si variablat. Ne fakt kur ato kalohen ne web server per perpunim, PHP-ja i ben ato te vlefshme si variabla.
GET Sipas rastit mund t’ju nevojitet te kaloni hapesira ne vlerat qe perbejne query string-un. Psh: nese keni nje form, qe ka nje tag <TEXTAREA> dhe dikush shkruan pergjigje hapesiren e tekstit, query stringu do te jete si me poshte: http://chrisu/form.php?TextArea=I+would+like+to+see+a+dynamic+menu+in+operation
Kodimi URL • Ne rastin e mesiperm plusi (+) zevendeson hapesirat. • Po nese duam te vendosim nje (+) ne Textarea? Ne kete rast karakteri ne fjale duhet te zevendesohet nga nje kod, i cili nenkupton kete karakter te veçante. • Ky njihet si Kodim i URL-se • Nje bashkesi karakteresh te veçanta nuk mund te shfaqen ne URL, prandaj per ato behet nje kodim ne URL. Ne fakt perdoruesi nuk duhet te beje asgje per te bere kodimin sepse kjo kryhet nga vete browseri, i cili zevendeson çdo karakter te tille me nje kod. • Query stringu me %20 ne vend te hapesires do te duket si me poshte: http://chrisu/form.php?TextArea=I%20would%20like%20to%20see%20a%20dynamic%20menu%20in%20operation
POST • Nje disavantazh i query string-ut eshte se informacioni eshte publik. • Nese nuk deshironi qe informacioni i derguar nga forma te shfaqet ne URL, atehere duhet te perdorni metoden POST. • Ajo punon pothuajse ne menyre identike me metoden GET, me ndryshimin qe informacioni ne forme dergohet ne trupin e kerkeses HTTP, ne vend qe te dergohet si pjese e URL-se. • Kjo do te thote qe nuk eshte e dukshme per kedo, sepse nuk shtohet ne URL. • Gjithashtu POST lejon te transmetohet nje sasi e madhe informacioni, ndersa ne GET ka nje kufi fizik per sasine e te dhenave qe mund te transmetohet si pjese e URL-se.
Duhet te perdorim GET apo POST? • Per kete ka nje perzierje opinionesh: disa thone qe nuk duhet te perdorni pothuajse kurre metoden GET, per shkak te pasigurise dhe kufizimit ne madhesi, te tjere thone qe duhet te perdorni GET per te marre informacion, ndersa POST duhet te perdoret kurdo qe modifikoni te dhenat ne web server. Pra nuk ka rregulla te prera per kete. • Nje disavantazh i POST eshte qe faqet e ngarkuara me POST nuk mund te shenjohen (book-marked) siç duhet, kurse faqet e ngarkuara me GET permbajne ne URL te gjithe informacionin qe nevojitet per te riprodhuar kerkesen. • Ne shume raste mund te shenjoni rezultatet e dergimit te formes duke perdorur GET, psh ne nje kerkim ne Alta Vista. Prandaj shume motore kerkimi perdorin GET.
Duhet te perdorim GET apo POST? • Gjithashtu edhe vete metoda POST nuk eshte e sigurte, meqe informacioni vendoset ne trupin e kerkeses HTTP dhe nuk eshte i dukshem menjehere. Informacioni nuk eshte i enkriptuar dhe perseri mund te kapet lehtesisht nga nje hacker. Per te vertetuar qe eshte i sigurte, ju nevojitet nje lidhje e sigurte me nje server te sigurte. • Se cilen metode duhet te perdorni, kjo varet nga ajo çfare deshironi qe te beje forma: • Nese perdorni GET keni parasysh kufizimet dhe faktin qe informacionet jane te dukshme per kedo. • Nese perdorni POST, keni parasysh qe ajo nuk mund te shenjohet nga motore kerkimi dhe vetem per faktin se eshte me e fshehte, nuk do te thote se eshte me e sigurte.
Kontrollet e formes ne HTML dhe PHP • Le te shohim disa kontrolle ne HTML dhe menyren se si mund te perdoren ato per te mbledhur informacionet e dhena ne nje forme dhe si mund te perdorim PHP-ne per te arritur me pas ne kete informacion. • Te gjithe shembujt ketu, kerkojne dy faqe web. E para terheq informacionin e postuar nga perdoruesi dhe e dyta e kthen informacionin nga web serveri dhe interpretuesi i skripteve, ne browser. • Faqja e pare nuk permban asnje skript PHP. Ne fakt ne shume site, faqja web qe permban formen do te jete HTML e paster dhe do te kete prapashtesen .htm ose .html. Natyrisht nuk ka nevoje qe te dergohet informacion ne interpretuesin e PHP-se, sepse meqe nuk permban PHP, atehere kjo vetem se do te shtonte me teper kohe per te gjeneruar faqen web qe do te kthehet ne browser.
Text Fields (Text Boxes) • Faqja e dyte text.php • <HTML> • <HEAD></HEAD> • <BODY> • Your favorite author is: • <?php • echo $_GET[‘Author’]; • ?> • </BODY> • </HTML> • Faqja e pare text.html • <HTML> • <HEAD></HEAD> • <BODY> • <FORM METHOD=GET ACTION="text.php"> • Who is your favourite author? • <INPUT NAME="Author" TYPE="TEXT"> • <BR> • <BR> • <INPUT TYPE=SUBMIT> • </FORM> • </BODY> • </HTML>
Text Fields (Text Boxes) • Pasi perdoruesi klikon ne butonin submit atehere afishohet faqja text.php, si me poshte: • KUJDES: Emrat e variablave jane case-sensitive.
Check Boxes • Faqja e dyte checkbox.php • <HTML> • <HEAD></HEAD> • <BODY> • <?php • echo $_POST[‘Choice’]; • ?> • </BODY> • </HTML> • Faqja e pare checkbox.html • <HTML> • <HEAD></HEAD> • <BODY> • <FORM METHOD=POST ACTION="checkbox.php"> • Have you ever eaten haggis before? • <INPUT NAME="Choice" TYPE="Checkbox"> • <BR> • <BR> • <INPUT TYPE=SUBMIT> • </FORM> • </BODY> • </HTML>
Check Boxes • Ne kete rast nese perdoruesi klikon (vendos shenjen) ne check box, atehere ne faqen tjeter do te afishohet ‘on’ ndersa nese nuk eshte e check-uar atehere nuk afishohet asgje. Pra ketu krijohet nje variabel qe nuk merr nje vlere te caktuar nga ne dhe ne rastin e dyte variabli nuk permban asnje vlere.
Multiple Check Boxes • Faqja e dyte checkboxes.php • <HTML> • <HEAD></HEAD> • <BODY> • <?php • if (isset($_POST['Choice1'])) echo $_POST['Choice1']; • echo "<BR>"; • if (isset($_POST['Choice2'])) echo $_POST['Choice2']; • echo "<BR>"; • if (isset($_POST['Choice3'])) echo $_POST['Choice3']; • echo "<BR>";?> • </BODY> • </HTML> • Faqja e pare checkboxes.html • <HTML> • <HEAD></HEAD> • <BODY> • <FORM METHOD=POST ACTION="checkboxes.php"> • Have you ever eaten haggis before? • <INPUT NAME="Choice1" TYPE="Checkbox" VALUE="Haggis"> • <BR> • Have you ever eaten snails before? • <INPUT NAME="Choice2" TYPE="Checkbox" VALUE="Snails"> • <BR> • Have you ever eaten locusts before? • <INPUT NAME="Choice3" TYPE="Checkbox" VALUE="Locusts"> • <BR><BR> • <INPUT TYPE=SUBMIT> • </FORM> • </BODY> • </HTML>
Multiple Check Boxes • KUJDES: Nese i emertoni te gjithe checkbox-et me te njejtin emer atehere edhe nese klikoni disa checkbox-e, do te afishohet vetem vlera e checkbox-it te fundit qe keni zgjedhur. • Have you ever eaten haggis before? • <INPUT NAME="Choice" TYPE="Checkbox" VALUE="Haggis"> • <BR> • Have you ever eaten snails before? • <INPUT NAME="Choice" TYPE="Checkbox" VALUE="Locusts"> • <BR> • Have you ever eaten locusts before? • <INPUT NAME="Choice" TYPE="Checkbox" VALUE="Snails">
Radio Buttons • Faqja e dyte radio.php • <HTML> • <HEAD></HEAD> • <BODY> • <?php • echo "You selected the answer: $_GET[Question1]"; • ?> • </BODY> • </HTML> • Faqja e pare radio.html • <HTML> • <HEAD></HEAD> • <BODY> • <FORM METHOD=GET ACTION="radio.php"> • What is the capital of Portugal? • <BR> • <BR> • <INPUT NAME="Question1" TYPE="Radio" VALUE="Porto">Porto • <BR> • <INPUT NAME="Question1" TYPE="Radio" VALUE="Lisbon">Lisbon • <BR> • <INPUT NAME="Question1" TYPE="Radio" VALUE="Madrid">Madrid • <BR><BR> • <INPUT TYPE=SUBMIT> • </FORM> • </BODY> • </HTML>
Radio Buttons Ne faqen tjeter do te afishohet “You selected the answer: Lisbon”
ListBox • Faqja e pare listbox.html <HTML> <HEAD></HEAD> <BODY> <FORM METHOD=GET ACTION="listbox.php"> What price of car are you looking to buy? <BR><BR> <SELECT NAME="Price"> <OPTION>Under $5,000</OPTION> <OPTION>$5,000-$10,000</OPTION> <OPTION>$10,000-$25,000</OPTION> <OPTION>Over $25,000</OPTION> </SELECT> <BR><BR>What size of engine would you consider?<BR><BR> <SELECT NAME="EngineSize[]" MULTIPLE> <OPTION>1.0L</OPTION> <OPTION>1.4L</OPTION> <OPTION>1.6L</OPTION> <OPTION>2.0L</OPTION> </SELECT> <BR><BR><INPUT TYPE=SUBMIT> </FORM> </BODY> </HTML>
ListBox Faqja e dyte listbox.php HTML> <HEAD></HEAD> <BODY> <?php echo "Price Range: $_GET[Price]"; echo "<BR>Engine Size(s): {$_GET[EngineSize][0]}"; echo "<BR>{$_GET[EngineSize][1]}"; echo "<BR>{$_GET[EngineSize][2]}"; echo "<BR>{$_GET[EngineSize][3]}"; ?> </BODY> </HTML>
Fushat e fshehura te formave • Nganjehere, ju nevojitet te merrni informacionin qe permbahet ne nje faqe web dhe ta kaloni ate ne nje faqe tjeter, pa kerkuar input nga perdoruesi. Psh: ky informacion mund te gjenerohet nga programi, skripti ose faqja web, ose informacion qe nuk eshte e nevojshme qe ta dije perdoruesi (psh koha e sakte kur eshte ngarkuar forma) • Ne keto raste, perdoren fushat e fshehura hidden form field (ose hidden control), te cilat jane si textbox-e, por qe nuk duken ne faqen web: <INPUT TYPE=HIDDEN NAME=Hidden1 VALUE="Secret Message">
Fushat e fshehura te formave • Kujdes: Fushat e fshehura te formave, nuk jane te fshehura nga pamja. Lexuesi mund t’I lexoje ato, nese shikon kodin burim te faqes, me “view source”. Keshtu qe nuk duhet te perdorni kurre nje fushe te fshehur per te ruajtur password-e apo ndonje informacion tjeter sensitiv.
Fushat e fshehura te formave Faqja e pare hidden.php <HTML> <HEAD></HEAD> <BODY> <?php $Message1="Bugs Bunny"; $Message2="Homer Simpson"; $Message3="Ren & Stimpy"; echo "<FORM METHOD=GET ACTION='hidden2.php'>"; echo "Which of the following would win in a shootout?"; echo "<SELECT NAME='ListBox'>"; echo "<OPTION>$Message1</OPTION>"; echo "<OPTION>$Message2</OPTION>"; echo "<OPTION>$Message3</OPTION>"; echo "</SELECT><BR><BR>"; echo "<INPUT TYPE=HIDDEN NAME=Hidden1 VALUE='$Message1'>"; echo "<INPUT TYPE=HIDDEN NAME=Hidden2 VALUE='$Message2'>"; echo "<INPUT TYPE=HIDDEN NAME=Hidden3 VALUE='$Message3'>"; echo "<INPUT TYPE=SUBMIT>"; echo "</FORM>"; ?> </BODY> </HTML>
Fushat e fshehura te formave Faqja e dyte hidden2.php <HTML> <HEAD></HEAD> <BODY> <?php echo "The three options were:<BR>"; echo "$_GET[Hidden1]<BR>"; echo "$_GET[Hidden2]<BR>"; echo "$_GET[Hidden3]<BR>"; echo "<BR>You selected:<BR>"; echo "$_GET[ListBox]"; ?></BODY> </HTML>