Једном када имате ХТМЛ форму и покренете, често ћете желети да се уверите да су сва важна поља попуњена. На примјер, ако ћете послати е-маил адресу за потврду е-поште, адресу е-поште треба укључити у поља поља , и требало би да буде адреса е-поште која ради.
Постоје два начина да потврдите своје форме:
- Коришћење ЈаваСцрипт-а
- Користећи ЦГИ скрипту
Предности употребе ЈаваСцрипт-а за валидацију образаца
- Коришћењем јавасцрипта не користите време процесора за сервер. Сва обрада се врши на клијентском рачунару.
- Често се чини да ради брже од валидације ЦГИ.
- С обзиром да се страница форми није променила, читачу је лако поправити грешке.
Збуњавање употребе ЈаваСцрипт-а за валидирање образаца
- ЈаваСцрипт ради само на претраживачима којима је омогућено. Ако је ЈаваСцрипт онемогућен, провера грешака се не врши.
Тхе Прос Усинг ЦГИ за валидирање форми
- Употреба ЦГИ за валидацију обезбеђује да сваки пут када се образац подноси, валидација ће се покренути.
Збуњеност употребе ЦГИ за валидирање форми
- ЦГИ ставља више оптерећења на Веб сервер, а свака функција која је укључена у ЦГИ је још један задатак за сервер.
- ЦГИ може бити споро да се покрене.
- Ако постоји грешка, клијент се мора вратити на прву страницу формулара, или ЦГИ-ју треба другу функцију да преправи страницу формулара.
Начин на који то решавам јесте да већина провере грешака ради са ЈаваСцрипт-ом. На тај начин, то је брзо и лако за читаоце.
Затим проверавам виталне елементе облика са ЦГИ.
Како користити ЈаваСцрипт за потврђивање ХТМЛ формулара
Основна претпоставка креирања валидације формулара је тражити имена елемента обрасца који су потребни, а ако су празни, приказати поруку о грешци.
Већина програма за проверу грешака проверава сваки по један по један и појави једну грешку истовремено.
Ово може учинити напорним испуњавањем форме, а људи могу да зауставе у средини. Ако користите следећу скрипту и Перл извор ћете знати како да потврдите цијели образац одједном, приказујући низ порука о грешци које ваш читатељ може вратити и поправити.
ЈаваСцрипт за валидацију образаца
У главном дијелу вашег ХТМЛ-а, треба креирати скрипту за извршавање валидације формулара:
- Подесите скрипту и проверите да ли је сакривен од прегледача који не могу да обављају ЈаваСцрипт. <сцрипт лангуаге = "ЈаваСцрипт">
- Ово је позив позива који покреће валидацију. Добар је облик за постављање варијабли на врху ваше скрипте.
функција Валидатор (тхеФорм)
{вар еррор = ""; - Ако имате у облику падајућих елемената, требало би да укључите прву опцију као празно поље (нпр. <Опција вриједност = ""> одаберите једну ) Можете укључити било који текст који желите на пољу, као док је вредност празна. Затим, када потврдите против ње, једноставно погледајте да ли је прва опција (празна) и даље постављена, ако јесте, напишите поруку о грешци. ако (тхеФорм.дд.оптионс [0] .селецтед == труе)
{
еррор + = "Молимо изаберите са падајуће листе. \ н";} - Елементи текста најлакше се потврђују. Једноставно проверите да ли је вредност празна. Ако јесте, подесите поруку о грешци. ако (тхеФорм.вордс.валуе == "")
{
еррор + = "Молим попуните елемент текста. \ н";}
- Ако желите да потврдите врсту података у текстуалном пољу, морате постати мало љубазнији. Овај одломак скрипте гледа у поље за текст да види да ли у њему има не-нумеричких знакова (променљива "цифре" дефинира оно што тражи).
вар цифре = "0123456789";
ако (тхеФорм.нумбер.валуе == "")
{
грешка + = "Молим попуните број. \ н";
}
за (вар и = 0; и <тхеФорм.нумбер.валуе.ленгтх; и ++)
{
темп = тхеФорм.нумбер.валуе.субстринг (и, и + 1)
ако (цифре.индекОф (темп) == -1 && тхеФорм.нумбер.валуе! = "")
{
грешка + = "Бројчани текст мора бити број. \ н";
пауза;
}}
Потврдите е-адресу са ЈаваСцрипт-ом
- Овај део скрипте показује како да потврдите за адресу е-поште. То је врло једноставна валидација, она само провјерава да ли је сигурно да постоји @ -сигн и период. Људи још увек могу да унесу лажне адресе е-поште, али то помаже да се мало погрешно умањи погрешан унос.
ако (тхеФорм.емаил.валуе == "")
{
еррор + = "Морате укључити тачну адресу е-поште за одговор. \ н";
}
ако ((тхеФорм.емаил.валуе.индекОф ('@', 0) == -1 ||
тхеФорм.емаил.валуе.индекОф ('.', 0) == -1) && тхеФорм.емаил.валуе! = "")
{
грешка + = "Молимо проверите да ли је ваша адреса е-поште важећа.";
}
- Ово је месо сценарија. Ради две ствари: прво, проверава да ли постоји грешка. Ако постоји, приказује је као поруку упозорења. Онда шаље повратну вриједност лажног, тако да се информације о образцу не шаљу на сервер. Ваше поруке о грешци (постављене у горенаведеним изразима), све укључују "\ н" на крају линије. Ово говори претраживачу да убаци повратак колица (или "унеси" или "нову линију") на крају линије. Затим, ако има неколико порука о грешци, сви ће бити на одвојеним линијама. Ако не постоје постављене поруке о грешци, онда ће варијабле грешке бити празне (одакле смо га поставили на врх скрипте), па ће информације о образцу бити послате на сервер на који ће ЦГИ деловати.
ако (грешка! = "")
{
упозорење (грешка);
повратак (лажно);
} елсе {
ретурн (труе);
} - Не заборавите да затворите скрипту.
}
// ->
Затим, да бисте позвали скрипту, ставите елемент онсубмит у ознаку обрасца:
<форм ацтион = "" метход = "пост" онсубмит = "ретурн Валидатор (тхис);">
ЦГИ за валидне форме
Овај фрагмент ЦГИ скрипте Перл-а врши исту ствар као и ЈаваСцрипт. Она проверава да ли постоје потребна поља, а ако не, чува поруку о грешци у варијаблу за приказ:
#! / уср / лоцал / бин / перл
$ еррор = "";
ако ($ у {'дд'} ек "")
{
$ еррор + = "
Изаберите из падајућег оквира.
";
}
ако ($ у {'ријечи'} ек "")
{
$ еррор + = "
Молимо унесите неке речи у текстуално поље.
";
}
# ... наставите проверавати сва поља
ако ($ грешка)
принт "Цонтент-типе: тект / хтмл \ н \ н";
принт "<хтмл> <хеад> <титле> Грешка ";
штампај " <боди & гт";
принт "<х2> Грешка је настала ";
принт $ еррор;
принт "Молимо вратите се и исправите ове грешке.";
принт " ";
} елсе {
# Наставите са ЦГИ ...
}
Разлика у томе како ЦГИ пише поруку о грешци је да уместо "\ н" користи ознаку ХТМЛ параграфа да стави нову линију између сваке грешке.
А сада сте потврдили свој образац
Са два метода, ЦГИ и ЈаваСцрипт, валидирали сте ХТМЛ форму тако да је више дијелова који су вам послани тачни.