Skip to content

Don't give default error messages to your clients give in their language which they understand !

License

Notifications You must be signed in to change notification settings

aslamanver/abvalidate

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

22 Commits
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

Custom Message - jQuery Form Validation - abValidate.js

1. Copy the CDN after your good scripts

<!-- If you have already jQuery script, then do not add this line -->
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

<!-- abValidate Library -->
<script type="text/javascript" src="https://raw.githubusercontent.com/aslamanver/abvalidate/master/abValidate.min.js"></script>
<link rel="stylesheet" href="https://raw.githubusercontent.com/aslamanver/abvalidate/master/abValidate.css">

2. How it works

  1. Initialize the library
$(document).ready(function () {
    //.ab-form is your form class
    $(".ab-form").abValidate();
});
  1. That's all, now write all of your code in your HTML
<form class="ab-form" action="your_action_url">
   
   <!-- Input and error message should be in a div class -->
   <div class="my-form-group">
        <input type="text" ab-validation="required|Hey dude you missed that,min:5| No no you want to type more" name="name" class="ab-validation-i" />
        <div class="error"></div>
    </div><br>

    <div class="my-form-group">
        <input type="submit" name="submit" value="Submit">
    </div>

</form>
  • Add .ab-validation-i class to your inputs which should be validated and write your validations in ab-validation
<input type="text" name="name" ab-validation="required,min:5" class="ab-validation-i" />
  • Examples
<input type="text" name="name" ab-validation="required|Hey dude you missed that,min:5| No no you want to type more" class="ab-validation-i" />

3. Wanna write more ?

$(".ab-form").abValidate({
    color: "#556b2f",
    backgroundColor: "white",
    debug: true
});

Return the form status

$(".ab-form").abValidate().success;

4. Avalilable validations

* required|message
* min:5|message
* max:5|message
* email|message
* confirm:elem_id - without #

About

Don't give default error messages to your clients give in their language which they understand !

Topics

Resources

License

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published