jQuery Validation Code

 Screen Shot:




<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">

    <meta http-equiv="X-UA-Compatible" content="IE=edge">

    <meta name="viewport" content="width=device-width, initial-scale=1.0">

    <title>Document</title>

    <style>

        .error{

            color:red;

        }

    </style>

</head>

<body align="center">

    <h1>jQuery Validiation</h1>

    <form action="" method="POST" id="frm">

        Name :<input type="text" name="username" id="username"><br><br>

        Email :<input type="text" name="email" id="email"><br><br>

        Password: <input type="password" name="password" id="password"><br><br>

        Male: <input type="radio" name="gender" id="gender" value="male">

        Female: <input type="radio" name="gender" id="gender" value="female"><br><br>

        Delhi: <input type="checkbox" name="delhi" id="delhi">

        Odisha: <input type="checkbox" name="odisha" id="odisha">

        Kolkata: <input type="checkbox" name="kolkata" id="kolkata"><br><br>

        <select name="dropdown" id="dropdown">

            <option hidden>choose</option>

            <option value="">Btech</option>

            <option value="">Bca</option>

            <option value="">Mca</option>

        </select><br><br>

        <textarea name="msg" id="" cols="30" rows="5"></textarea><br><br>

        <input type="submit" name="btn" id="btn" value="submit">

    </form>

        <!-- jQuery CDN -->

    <script src="https://code.jquery.com/jquery-3.6.0.js" integrity="sha256-H+K7U5CnXl1h5ywQfKtSj8PCmoN9aaq30gDh27Xc0jk=" crossorigin="anonymous"></script>


        <!-- jQuery validation CDN -->

    <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery-validate/1.19.3/jquery.validate.min.js" integrity="sha512-37T7leoNS06R80c8Ulq7cdCDU5MNQBwlYoy1TX/WUsLFC2eYNqtKlV0QjH7r8JpG/S0GUMZwebnVFLPd6SU5yg==" crossorigin="anonymous" referrerpolicy="no-referrer"></script>


        <!-- file path -->

    <script src="validation.js"></script>

</body>

</html>


validation.js:


jQuery('#frm').validate({

    rules: {

        username: "required",

        email: "required",

        password: {

            required: true,

            minlength: 10

        },

        gender: "required",

        delhi: "required",

        odisha: "required",

        kolkata: "required",

        dropdown: "required",

        msg: "required"

    }, messages: {

        username: "please enter your name",

        email: "please enter your email",

        password: {

            required: "please enter your password",

            minlength: "Password much be 10 charecters",

        }


    }


})


Comments

Post a Comment

Popular posts from this blog

C.R.U.D Oparetion in (PHP Code)

C.R.U.D Oparetion   index.php <?php include "conn.php"; if (isset($_POST["usersubmit"]))  {     $vrname = $_POST["username"];     $vremployee = $_POST["useremployee"];     $vrsalary = $_POST["usersalary"];     $vrgender = $_POST["gender"];     //testing sucessfully complete     // echo $vrname;     // echo $vremployee;     // echo $vrsalary;     // echo $vrgender;     // exit();     $inserting = "INSERT INTO dbemployeelist(dbname, dbemployee, dbsalary, dbgender) VALUES('$vrname', '$vremployee', '$vrsalary', '$vrgender')";     $connecting = mysqli_query($conn,$inserting); } ?> <!DOCTYPE html> <html lang="en"> <head>     <title>Document</title>     <style>         form{             text-align:center;             padding:2...
Read more

Search Dropdown - jQuery

Image
<select name="vehicle_no" id="vehicle_no" class="form-control select" >   <option value="" >Select Vehicle</option>      <?php //echo $vchVehicleNumber;exit;?>           @foreach($vehiclesData as $data)              <option {{(isset($vchVehicleNumber) && $vchVehicleNumber == $data['vehicleno'])?'selected':''}} value="{{ $data['vehicleno'] }}" >{{ $data['vehicleno'] }}</option>              @endforeach </select> // jQuery:- you have to add CDN of select2 jquery $("#vehicle_no").select2({   minimumResultsForSearch: Infinity }); $('#vehicle_no').select2({    minimumInputLength: 0  });
Read more

JavaScript Form Validation Code

 <html>    <head>       <title>Javascript All At Once Validation</title>       <script>          function validate(){          var eid=document.getElementById("eid");          var ename=document.getElementById("ename");          var epass=document.getElementById("epass");          var ecpass=document.getElementById("ecpass");          var eadd=document.getElementById("eadd");          var ecity=document.getElementById("ecity");          var epin=document.getElementById("epin");          var eemail=document.getElementById("eemail");          if(notEmpty(eid,"Employee ID Should Not Be Blank"))          {           if(o...
Read more