programming bootstrap

Jquery xác thực biểu mẫu bootstrap 5

jbvalidator là plugin xác thực biểu mẫu dựa trên jQuery mới được tạo cho khung Bootstrap 5 mới nhất và hỗ trợ cả xác thực phía máy khách và phía máy chủ

Đa ngôn ngữ
Thông báo lỗi tùy chỉnh
Quy tắc xác thực tùy chỉnh
Dễ sử dụng thông qua thuộc tính dữ liệu HTML

Cài đặt

npm i @emretulek/jbvalidator

Hoặc lấy từ jsdelivr CDN

LIÊN KẾT BẢN THỬ

xác thực Html 5
dữ liệu-v-bằng. id của phần tử phải giống nhau
dữ liệu-v-min-chọn. nhiều hộp chọn, số lượng có thể chọn tối thiểu
dữ liệu-v-max-chọn. nhiều hộp chọn, số lượng có thể chọn tối đa
dữ liệu-hộp kiểm-nhóm. thuộc tính cha của các phần tử hộp kiểm nhóm
dữ liệu-v-min. thay thế của thuộc tính tối thiểu, điều này có thể được sử dụng cho văn bản loại thuộc tính
dữ liệu-v-max. thay thế của thuộc tính max, thuộc tính này có thể được sử dụng cho văn bản loại thuộc tính
data-v-min-length. thay thế của thuộc tính minlength
dữ liệu-v-chiều dài tối đa. thay thế của thuộc tính maxlength
data-v-min-size. kích thước tệp tối thiểu của tệp loại đầu vào [byte]
dữ liệu-v-max-size. kích thước tệp tối đa của tệp loại đầu vào [byte]
dữ liệu-v-tin nhắn. thông báo lỗi thay thế

phương pháp

trình xác nhận. thêm xác thực tùy chỉnh mới
checkAll[formSelector = null, event = null]. hiển thị lỗi mà không gửi biểu mẫu, trả lại số lỗi
errorTrigger[bộ chọn đầu vào, thông báo]. hiển thị các thông báo lỗi được trả về từ máy chủ
tải lại[]. tải lại phiên bản sau khi phần tử động được thêm vào

Cách sử dụng

Thuộc tính của biểu mẫu phải hợp lệ hóa



    $[function []{

        let validator = $['form.needs-validation'].jbvalidator[{
            errorMessage: true,
            successClass: true,
            language: "//emretulek.github.io/jbvalidator/dist/lang/en.json"
        }];

        //custom validate methode
        validator.validator.custom = function[el, event]{
            if[$[el].is['[name=password]'] && $[el].val[].length