DarksTeam Forum

Go Back   DarksTeam Forum > > > >

Thread Tools Display Modes
  (#1) Old
Dea7h Dea7h is online now
Dea7h's Avatar
Posts: 1,061
Thanked 388 Times in 267 Posts
Mood: Amused
Join Date: Jan 2009
Location: Sweden, Stockholm
Default [Release] Universal Form Validation with Javascript (jQuery required) - 17-11-2017, 21:43

Hello everyone! I was writing some codes and I needed to write a form validation for my website. Decided to share it here with you and as it may be nothing new for the majority it may also come in handy for many.

The beauty of it is that you write it once and you can use it anywhere in any given form in your website without repeating a whole bunch of code every single time like the most websites do.

So here comes the main function that you need to put in your main javascript file
PHP Code:
$(document).ready(function () {
'.mainNoticer, .subNoticer').click(function () {

displayMessage($str$type 'error') {
$contain = $('.mainNoticer');
$message = $('.subNoticer');
    switch (
$type) {
$message.empty().append("<font style='color: #14972f;'>" $str "</font>");
$message.empty().append("<font style='color: #ff7c7c;'>" $str "</font>");

validate($form$array) {
$errors = [];

each($array, function ($name$rules) {
each($rules, function ($rule$rule_value) {
$value = $($form ' [name=' $name ']').val();
            switch (
$rule) {
                    if (
$value.length $rule_value[0]) {
$errors.push("The <b>" $rules['name'] + "</b> cannot be shorter than <b>" $rule_value[0] + "</b> characters");
                    } else if (
$value.length $rule_value[1]) {
$errors.push("The <b>" $rules['name'] + "</b> cannot be longer than <b>" $rule_value[1] + "</b> characters");
pattern = {
ALP: /^[a-z]+$/i,
NUM: /^[0-9]+$/,
ALPNUM: /^[a-z0-9]+$/i,
EMAIL: /^[a-z0-9._@-]+$/i

                    if (!
pattern[$rule_value].test($value)) {
$errors.push("The <b>" $rules['name'] + "</b> contains forbidden characters ");

    if (
jQuery.isEmptyObject($errors)) {
    } else {
        for (
$i 0$errors_list ''$i $errors.length$i++) {
$errors_list += $errors[$i] + '<br />';


then you should put these few lines of code in your index.php (or whatever it's called) file for the messages to show

PHP Code:
<div class="mainNoticer"><div class="subNoticer">#notice</div></div> 
and then some style for the message box, put that in your .css file

PHP Code:
.mainNoticer {

subNoticer {
border1px solid #2d0808;

and now to use it you need to do the following...

Let's say you wanna use it in your register file (even tough it works in any form like your character reset form, stats adder or whatever you like)

There are few things you need to do:

1st you need to change your "Submit" button like that:
Let's say you have something like
PHP Code:
<input type="submit" value="Register" /> 
It needs to become like that
PHP Code:
<input type="button" value="Register" onClick="check()" /> 
2nd you need to give your <form> an id, something like this:
PHP Code:
<form action="" method="post" id="register_form"
the important part of this is the id="register_form"

and 3rd you need to put this code in your register.php file to say to the validation what you want it to validate as it follows:
PHP Code:
<script type="text/javascript">
check() {
        if (
validate('#register_form', {
username: { //This stands for your input name attribute on each field (<input type="text" name="username">)
name: ['Username'], //This is just for the message output, you type whatever you want here
range: [410],
pattern: ['ALPNUM']
password: {//Same with this one... (<input type="password" name="password">)
name: ['Password'],
range: [410],
pattern: ['ALPNUM']
email: {
name: ['E-Mail Address'],
range: [535],
pattern: ['EMAIL']
captcha: {
name: ['Captcha Code'],
range: [55],
pattern: ['ALPNUM']
        })) {
'#register_form').submit(); //If everything is okay and all the fields are validated you submit the form
The message output in just for the example it's not even near pretty, feel free to use your own message style whatever it might be...

For the moment there are just 2 validation criteria range and 4 patterns:
ALP = only letters are allowed
NUM = only numbers allowed
ALPNUM = numbers and letters
EMAIL = numbers, letters . - _ and @ are allowed

IMPORTANT you need jQuery (direct download link) for this to work (it's pretty much a must have in any website)

!!NOTICE!!! This is not a final validation, you still need to validate all the fields in your php code

If I have missed anything I will update the thread! I hope someone will have a use for it...
If anyone have any suggestions on how to make it better just let me know ;] Peace <3

Credits: Dea7h (mainly )

Reply With Quote
The Following User Says Thank You to Dea7h For This Useful Post:
NFmc (03-01-2018)
  (#2) Old
RaFa RaFa is offline
Dirty south, mayne!
RaFa's Avatar
Posts: 734
Thanked 464 Times in 235 Posts
Mood: Psychedelic
Join Date: Jan 2009
Location: Bulgaria
[Release] Universal Form Validation with Javascript (jQuery required)
Default 08-01-2018, 14:44

If you're supporting only new web browsers (and you're kind of good with regex), you can use patterns

Tryit Editor v3.5
Reply With Quote
The Following User Says Thank You to RaFa For This Useful Post:
Dea7h (08-01-2018)
  (#3) Old
r00tme r00tme is offline
Posts: 391
Thanked 527 Times in 206 Posts
Mood: Relaxed
Join Date: Apr 2014
Location: London
[Release] Universal Form Validation with Javascript (jQuery required)
Default 17-01-2018, 23:00

изобщо не виждам смисъл да има някаква филтрация в клиентската част, след като без такава в сървърната така или иначе не може да мине.
Reply With Quote
  (#4) Old
AnHiMiLaToR AnHiMiLaToR is offline
The best or nothing.
AnHiMiLaToR's Avatar
Posts: 214
Thanked 79 Times in 25 Posts
Join Date: Jul 2008
Location: European Union
Default 17-01-2018, 23:54

Има смисъл единствено да не ти нулира инпутите, както и че всички клиенти го искат.

11.02.2018 ONLINE NOW AnHiMiLaToR's MU REBOOT (1.0L / 1.0M)
12.02.2013 - 27.02.2013 | AnHiMiLaToR's MU (97d / 1.0L) | ONLINE: ~25 people | Reason of shutting down: Hardware BLOWN
22.08.2006 - XX.02.2007 | AnHiMiLaToR's MU 1.0L original | ONLINE: ~150 people | Reason of shutting down: unreliable hosting person
Reply With Quote

Thread Tools
Display Modes

Posting Rules
You may not post new threads
You may not post replies
You may not post attachments
You may not edit your posts

BB code is On
Smilies are On
[IMG] code is On
HTML code is Off

Forum Jump

Copyright ©2000 - 2018, vBulletin Solutions, Inc.

no new posts