Образац је елемент у ХТМЛ -у јер нам омогућава унос података и стога такође ступају у интеракцију са вебом и његовом базом података, што захтева контроле са становишта безбедности, будући да из обрасца можемо слати датотеке на сервер, за обраду наруџбине или плаћања, одабиром различитих елемената и контрола обрасца, који ће затим бити обрађен јавасцрипт догађајем или неким другим веб програмским језиком.
Много пута програмери морају да користе различите библиотеке да би могли да извршавају задатке у обрасцима како би контролисали догађаје, а у неким случајевима морамо да прибегнемо неким непожељним методама кода за слање података, контролу унешеног, избегавање убризгавања кода или КССС напада.
Ако желимо извршити све ове контроле и догађаје, можемо пронаћи велики број јавасцрипт датотека које значајно повећавају тежину веба у кб и успоравају страницу. Такође је несигурно јер ако неко онемогући употребу Јавасцрипта, све контроле ће престати да раде.
Елементи форме и атрибути у ХТМЛ5 пружају већи степен контроле и семантичког означавања од претходне верзије, додани су атрибути и својства која елиминишу потребу за екстерним контролама преко скрипти. Функције образаца у ХТМЛ5 пружају бољу контролу и не зависе од тога да ли је Јавасцрипт омогућен или онемогућен у вашем прегледачу.
ХТМЛ5 атрибути обрасца - чувар места
Помоћу место чувара имовине Можемо навести пример врсте података који се региструју, што нам омогућава да кориснику пружимо информације које ће нам послужити као водич. Овај текст који означимо унутар контроле нестаће након што корисник унесе знак.
Атрибут чувара места може се користити само у оквирима за текст или у текстуалним подручјима.
Обрасци са регуларним изразима у обрасцима
Атрибут узорка омогућава нам да дефинишемо наша правила за проверу података које корисник уноси помоћу регуларних израза. Регуларни израз је низ знакова који дефинише образац података, на пример, образац [а-з] означава да корисник може да уноси само мала слова или образац [0-9] означава да се могу унети само бројеви.
ХТМЛ5 вам омогућава да користите обрасце, па ако унети знакови не одговарају аутоматски дефинисаном обрасцу, генерисаће се грешка.
Ми идемо на дефинишите нека правила обрасцима и стилским листовима да промените боју ивице ако се догоди неважећи догађај, односно оно што је унео корисник није у складу са оним што је дефинисано у одређеном обрасцу.
Креирамо датотеку Екампле01.хтмл и уписујемо следећи код:
Обрасци са регуларним изразима
Корисник
Кључ:
Е-маил:
Датум
Цена
Ако пошаљемо образац, он ће потврдити свако поље у односу на дефинисани образац, а ако није испуњен, приказаће поруку коју дефинишемо у насловној ознаци, користиће и стилове дефинисане у правилу и својства ЦСС -а неважеће класе коју користи ХТМЛ5.
На пример, уносимо погрешну адресу е -поште:
Такође уносимо нетачан датум и видимо да не дозвољава слање обрасца. Ако желимо да побољшамо или додамо визуелни ефекат, можемо да користимо ЦСС да бисмо додали икону позадине у контролу где долази до квара. На пример, додајемо следеће цсс стилове онима које смо већ имали, улаз мењамо на инпут [типе = 'тект'] тако да стилски листови утичу само на поља за текст, а не и на дугме.
Користимо следеће иконе:
Поред сваке контроле додајемо потребно својство, на пример:
Приликом извршавања примера можемо видети да ће нам, ако пошаљемо образац са празним пољима, бити приказана обавезна и важећа поља.
Предност шаблона је у томе што не користимо ЈКуери или било коју другу врсту провере ваљаности и ако је ова опција деактивирана у прегледачу, ограничења и правила која дефинишемо ће наставити да функционишу. То не значи да подношењем обрасца избегавамо контроле приликом обраде података, да ли да их сачувамо у бази података или пошаљемо поштом или извршимо било коју операцију.
Образац са више поднесака
Нешто што је било сложено учинити је пошаљите исти образац на две различите страницеПретпоставимо да ће један образац за пријаву отићи на различите странице када се кликну на дугме и отићи ће на различите странице на којима се мењају упити и процес информација. То се постиже дефинисањем својство формације, где подразумевано означавамо другу опцију обраде радње.
Образац са више поднесака
Корисник:
Кључ:
Нема сумње да интеракција са овим типовима својстава и атрибута у великој мери олакшава развој веб страница, без потребе за коришћењем спољних библиотека и сложених јавасцрипт кодова.
Као дизајнери и програмери, обично налазимо да скрипта има одређену монотонију за структуирање хтмл -а и проверу ваљаности, посебно за писање правила валидације и затим приказивање кориснику када дође до грешке. ХТМЛ 5 уводи ове нове атрибуте, типове уноса и друге елементе тако да морамо писати мање кода и више се фокусирати на семантику него на синтаксу.
Ова правила функционишу у свим прегледачима, независно од оперативног система и не морамо да користимо друге библиотеке или хакове за прилагођавање различитим системима или уређајима. Видели смо неколико атрибута обрасца који помажу у побољшању корисничког искуства и штеде време за развој. Постоје неки атрибути који још увек не функционишу у свим прегледачима.
