Уеб формуляри (част 2)
МНОГОРЕДОВИ ПОЛЕТА ЗА ВЪВЕЖДАНЕ НА ТЕКСТ
Ако желаете да предоставите възможност на посетителите си да оставят по-подробно мнение или коментар трябва да използвате многоредово поле за въвеждане на текст. Многоредовите полета се въвеждат чрез тага textarea, който притежава затварящ таг. Атрибутите на тага са:
- Атрибута name, който определя названието, под което ще се съхранява и обработва тази част от формуляра
- Атрибута rows, на който се присвоява като стойност някаква цифра, указваща височина на полето в брой редове
- Атрибута cols, на който се присвоява като стойност някаква цифра, указваща ширината на полето в брой знаци (цифри, букви и др.)
Ако желаете да напишете текст, който да указва предназначението на многоредовото поле, трябва да изпишете текста между тага form и тага textarea.
Ако желаете да напишете текст, който да се вижда вътре в самото многоредово поле, трябва да изпишете текста между тага textarea и неговия затварящ таг.
ПРИМЕР:
Нека направим многоредово поле с название Comentar, с дължина 50 знака и височина 10 реда. Указващия текст към полето да бъде "Вашия коментар:", а вътре в самото поле да се вижда текста "Смятам че".
<form>
Вашия коментар:<br />
<textarea name="Comentar" cols="50" rows="10">Смятам че</textarea>
</form>
Ако коментарът е дълъг и не се събере във видимата част на полето, отстрани ще се появи лента за превъртане.
Ако по някаква причина желаете многоредовото текстово поле да се вижда, но да не може да се ползва, трябва да добавите към тага textarea атрибута readonly със стойност самото му название(readonly="readonly") или disabled със стойност самото му название (disabled="disabled").
ПОЛЕ ЗА ВЪВЕЖДАНЕ НА ПАРОЛА
Забелязали сте, че когато попълвате паролата си при отваряне на вашата електронна поща тя не се показва в полето като текст, а във вид на "звездички", например *******. Такова поле можете да въведете и вие в своя формуляр, за да защитите от чужд поглед определена информация, въвеждана във формуляра от ваши клиенти. За да изработите такова поле трябва да зададете на атрибута type от тага input стойността "password":
<form>
Въведете своята парола: <input type="password" name="parola" />
</form>
ПОЛЕ ЗА ПРЕХВЪРЛЯНЕ (UPLOAD) НА ФАЙЛОВЕ
Ако във формуляра има изискване клиента да приложи някакъв графичен файл /снимка, графика и др./, трябва да използвате кода, който дава възможност клиента да прехвърли файла от личния си компютър. За целта на атрибута type от тага input се присвоява стойността file. Използват се и атрибутите size и name с които се задава съответно дължина на полето в брой символи и название, което да съответства на предназначението на полето.
След изписване на кода в прозореца на браузъра се изобразява поле и бутон с надпис Browse. При натискане върху бутона се появява панел с файловете от личния компютър на клиента, от който той избира нужния за прехвърляне файл.
Нека направим поле за ъплоудване /прехвърляне/ на файлове с дължина 25 символа и название "UploadFile". Обяснителния текст към полето да бъде "Прехвърлете файл от личния си компютър:". Кода изглежда така:
<form enctype="multipart/form-data" >
Прехвърлете файл от личния си компютър: <input type="file" size="25" name="UploadFile" />
</form>
NB: Не оставайте с впечатлението, че това поле се използва само за качване на графични файлове. Практически с него може да пъде прехвърлен абсолютно всякакъв файл / файлов формат!
Задължително условие за да работи нашият формуляр за качване на файлове е във form тага да се постави атрибутът enctype със стойност "multipart/form-data". По този начин съдържанието на всеки файл ще бъде „опаковано” за подаване в отделен раздел на multipart документ. Това е единственият начин, по който формулярът би сработтил.
НАЧИНИ ЗА ОБРАБОТВАНЕ НА ФОРМУЛЯРИ
Всичко което научихте досега за формулярите е напълно безполезно ако не знаете какво да правите с попълнената от клиента информация - как и къде се изпраща и съхранява тя, така че да може да я използвате.
За да бъде използваем един формуляр той трябва задължително да притежава следните елементи:
- 1. Бутони
За да бъде използваем формуляра клиентът трябва да има възможност да съхрани и да изпрати за обработка попълнените данни. За целта в повечето случаи се използва бутона "Submit". Обикновено този бутон може да се види в края на формуляра. Чрез натискане на бутон "Submit" данните се изпращат за обработка и съхранение и по този начин завършва работата по попълването на формуляра.
За изработването на бутона "Submit" в HTML е предвидена следната команда:
<form>
<input type="submit" value="Submit" />
</form>
Аналогично е изработването на бутон "Reset" чрез който формуляра се изчиства и се изтриват попълнените вече данни /например ако клиента се е отказал да изпраща информацията или желае да попълни други данни/.
- 2. Указване на начин за обработка на формуляра
След като формуляра е попълнен клиента натиска бутона Submit и тук вече следва действието по изпращането на формуляра за обработка и съхранение.
Възможно е ролята на submit бутона да се изиграе и от картинка. Това става, чрез използване на следният таг:
<input type=”image” src=”../images/submit-button.png” />
Както е видно, посредством атрибута src, подобно на img тагът, оказваме адресът до картинката, използвана вместо submit бутон. Лесно е, нали?
За да бъде информацията от формуляра обработена, то тя трябва да се подаде на даден скрипт (бил той PHP, CGI, ASP, JSP или някакъв друг). Скриптът приема данните и в зависимост от информацията, която носят предприема определено действие (пр.: извършва търсене с подадените ключови думи, прави проверка дали даденият потребител съществува, логва ни в сайта и т.н.).
NB! Скриптът е приложение, написано на програмен език, което управлява даден софтуер. Звучи сложно, но всъщност не е. Примерно браузърът Firefox е приложение, което може да бъде управлявано от Java Script. JS се явява скриптовият език, а Firefox – управляваният от него софтуер.
За да посочим кой е скриптът, който трябва да поеме, обработи и евентуално съхрани данните от формулярът задължително трябва да използваме атрибутът action, изписан в отварящият form таг:
| <form action="modules/myscript.php"> ......... ......... ......... </form> |
В XHTML изписването на action атрибут за ВСИЧКИ формуляри е задължително, дори когато данните се изпращат към текущата страница!
От всичко казано дотук става ясно, че вие трябва да притежавате скрипт и да го качите на сървъра, където се намира и сайтът ви. Скрипт може да придобиете по няколко начина. Ако владеете някой от програмните езици може сами да си напишете скрипт. Може да помолите някой да ви го напише или да потърсите в интернет сайтове, от които да си изтеглите готов безплатен скрипт - съществуват много такива страници. Ако изтеглите готов скрипт ще са ви необходими поне минимални познания по съответния програмен език, за да преправите скрипта, така, че да ви върши работа.
Имайте предвид, че не всички хостинги позволяват качването на скриптове (особено безплатните такива). Скриптовете се изпълняват от специално приложение на сървъра, а безплатните сървъри обикновено не разполагат с такава възможност и ви предлагат да качите само статично съдържание.
Друг важен атрибут на тага form е method.
Чрез атрибута method се определя какво действие ще се извърши с формуляра (метода, по който ще се оперира с данните) и може да приема стойности get и post. Стойността get изпраща съдържанието на формата на указан URL. Този метод не бива да се ползва, ако дължината на данните във формата превишава 100 символа и ако формата съдържа нещо различно от текстови знаци. Метода post добавя съдържанието на формата към тялото на заявката и го изпраща за обработка от скрипта, указан чрез атрибута action.
ПРИМЕР:
<form action="myscript.php" method="post">
.........
.........
.........
</form>
