Share Kiểm tra tính hợp lệ khi nhập dữ liệu với thư viện validate.js

filiallion

Administrator
Staff member
Administrator
Messages
585
Points
10
Language
Tiếng Việt
Kiểm tra tính hợp lệ khi người dùng nhập dữ liệu trên form là một chức năng bắt buộc phải có để đảm bảo dữ liệu nhận được là dữ liệu hợp lệ. Hiện nay có khá nhiều thư viện JavaScript để thực hiện việc này, một trong số đó tôi đã giới thiệu cho các bạn ở bài viết "Kiểm tra tính hợp lệ của dữ liệu với thư viện jQuery Validation". Bài viết này, tôi tiếp tục giới thiệu với các bạn một thư viện khác để thực hiện chức năng kiểm tra dữ liệu đó là thư viện validate.js.

Thư viện validate.js có chức năng giống như thư viện jQuery Validation mà tôi đã giới thiệu trước đây. Tuy nhiên, thư viện validate.js hỗ trợ nhiều tính năng hơn, cho phép tuỳ biến tốt hơn và hơn nữa nó còn được phát triển để các bạn lập trình viên có thể tích hợp dễ dàng vào Nodejs, React,... Với bài viết này, tôi chỉ hướng dẫn các bạn sử dụng trên giao diện được thiết kế đơn thuần bằng HTML/CSS chứ không đi vào việc sử dụng cho Nodejs, React hay các framework khác.

Để sử dụng thư viện validate.js, các bạn truy cập địa chỉ https://github.com/ansman/validate.js để tải thư viện validate.js.

Các bạn tích hợp thư viện validate.js vào website với dòng mã lệnh HTML như sau:
HTML:
<script src="path/to/validate.min.js"></script>
Các bạn tham khảo ví dụ sau để biết cách sử dụng thư viện validate.js:
JavaScript:
//Khai báo mẫu kiểm tra
var constraints = {
    creditCardNumber: {
        presence: true,
        format: {
            pattern: /^(34|37|4|5[1-5]).*$/,
            message: 'Số thẻ tín dụng %{value} bạn nhập không hợp lệ'
        }
    }
};

//Thực hiện kiểm tra với mã thẻ là số 4
validate({creditCardNumber: '4'}, constraints);
Dữ liệu được kiểm tra ở ví dụ trên là không hợp lệ.

Các bạn có thể tìm hiểu thêm về thư viện validate.js tại địa chỉ https://validatejs.org.
 
Back
Top