als-validate
v0.7.3
Published
Validat form:email,password,confirm password,captcha
Downloads
5
Readme
als-Validate
new in 0.7.3
- bug for counting uppers, specials, lowers fixed
new in 0.7.2
- bug for upper, special, lower fixed
new in 0.7.11
min
andmax
attributes for length validate iftype!="number"
new in 0.7
- No need to add attribute
email
, just usetype="email"
min
andmax
attributes for length validate only attype="text"
- custom
validate="invalid|valid"
to each input (see example for checkbox)
new in 0.6
- Fixed issue with multiple forms and showing password
new in 0.5
- Disable Autocomplete option not available (didn't work properly and caused some problems)
new in 0.55
- Checkbox validation for required added
new in 0.4
- show password - only by attribute show="true/false"
- password confirmation by adding attribute confirm="id_for_confirm"
Available attributes:
- validate="is-invalid|is-valid"
- error="element-id-for-errors"
- type="email"
- show="true/false"
- min="minimum characters"
- max="maximum characters"
- upper="minumum appercases"
- lower="minumum lowercases"
- number="minumum numbers"
- special="minumum specisa"
- confirm="input_id_for_confirm"
- required
- type="captcha"
<script src="node_modules/als-validator/validate.js"></script>
<script>
Validate.forms() // looking for forms and read their attributes
</script>
<form validate="is-invalid|is-valid">
<div>Email:</div>
<div><input type="email" name="email" error="email-error" required></div>
<div><small id="email-error">Write valid email</small></div>
<br>
<div>Password:</div>
<div style="display:flex;">
<input type="password" name="password" error="password-error" id="password"
min="8" max="10" upper="0" lower="0" number="0" special="0" show="false" required>
</div>
<div><small id="password-error">Type password</small></div>
<br>
<div>Confirm Password:</div>
<div style="display:flex;"><input type="password" error="repassword-error"
name="repassword" required confirm="password" show="false"></div>
<div><small id="repassword-error">Confirm password</small></div>
<br>
<div>Accept policy:</div>
<label>
<input type="checkbox" error="policy-error"
validate="btn-danger|btn-success" name="policy" required>
<div>Accept policy</div>
</label>
<div><small id="policy-error">Accept policy</small></div>
<br>
<div>Solve the equation:</div>
<div><input type="captcha" id='text' error="captcha-error"></div>
<div><small id="captcha-error"></small></div>
<div>
<button type="submit" class="btn btn-primary" id="submit">Register</button>
</div>
</form>