initial commit

2026-08-27 11:22:01 -06:00
commit 82307da654
284 changed files with 321187 additions and 0 deletions
@@ -0,0 +1,125 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+  <meta charset="UTF-8">
+  <title>Title</title>
+  <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
+  <style>
+    .no-float {
+      float: none;
+    }
+
+    .mt30 {
+      margin-top: 30px;
+    }
+
+    .js-validate-error-label {
+      margin-top: 5px;
+    }
+
+    .form__radio, .form__checkbox {
+      margin-right: 7px !important;
+    }
+  </style>
+</head>
+<body class="container">
+<div class="col-md-6 center-block no-float mt30">
+  <form action="#" class="js-form form">
+    <div class="row">
+      <div class="form-group col-md-6">
+        <input type="text" class="form__input form-control" placeholder="Enter your name" autocomplete="off" data-validate-field="name" name="name" value="dkdf">
+      </div>
+      <div class="form-group col-md-6">
+        <input type="text" class="form__input form-control" placeholder="Enter your login" autocomplete="off" data-validate-field="login" name="login" value="zzz">
+      </div>
+      <div class="form-group col-md-6">
+        <input type="email" class="form__input form-control" placeholder="Enter your email" autocomplete="off" data-validate-field="email" name="email" value="[email protected]">
+      </div>
+    </div>
+    <div class="form-group">
+      <input type="password" class="form__input form-control" placeholder="Enter your password" autocomplete="off" data-validate-field="password" name="password" value="123fd">
+    </div>
+    <div class="form-group">
+      <div>
+        <div>
+          <textarea name="msg" cols="30" rows="10" class="form__textarea form-control" data-validate-field="text">sdfsfsdfsdf</textarea>
+        </div>
+      </div>
+    </div>
+    <div class="form-group">
+      <input type="checkbox" name="check1" id="checkbox" class="form__checkbox"  checked><label for="checkbox">I agree</label>
+    </div>
+    <div class="form-group">
+      <label><input type="checkbox" name="check2" class="form__checkbox" data-validate-field="checkbox2" checked>I agree</label>
+    </div>
+    <div class="form-group">
+      <label><input type="radio" name="radio" class="form__radio" data-validate-field="radio">Male</label>
+      <br>
+      <label><input type="radio" name="radio" class="form__radio" data-validate-field="radio">Female</label>
+    </div>
+    <button class="form__btn btn btn-primary">SUBMIT</button>
+  </form>
+</div>
+
+<script src="js/just-validate.min.js"></script>
+
+<script>
+    new window.JustValidate('.js-form', {
+        rules: {
+            checkbox2: {
+                required: true
+            },
+            radio: {
+                required: true
+            },
+            email: {
+                required: true,
+                email: true,
+                remote: {
+                    url: 'https://just-validate-api.herokuapp.com/check-correct',
+                    sendParam: 'email',
+                    successAnswer: 'OK',
+                    method: 'GET',
+                }
+            },
+            login: {
+                required: true,
+                remote: {
+                    url: 'https://just-validate-api.herokuapp.com/check-correct',
+                    sendParam: 'login',
+                    successAnswer: 'OK',
+                    method: 'GET'
+                }
+            },
+            password: {
+                strength: {
+                    custom: '^(?=.*[a-z])(?=.*[A-Z])(?=.*\\d)[a-zA-Z\\d]',
+                },
+            },
+        },
+        messages: {
+            login: {
+                remote: 'Login already exists'
+            }
+        },
+        focusWrongField: true,
+        submitHandler: function (form, values, ajax) {
+            console.log(values)
+            ajax({
+                url: 'https://just-validate-api.herokuapp.com/submit',
+                method: 'POST',
+                data: values,
+                async: true,
+                callback: (response) => {
+                    console.log(response);
+                }
+            });
+        },
+        invalidFormCallback: function (errors) {
+            console.log(errors);
+        },
+    });
+</script>
+
+</body>
+</html>