Hộp kiểm còn được gọi là hộp đánh dấu hoặc hộp lựa chọn. Hộp kiểm là một thành phần giao diện người dùng nhỏ cho phép người dùng chọn nhiều tùy chọn từ danh sách tùy chọn nhất định
Chúng tôi sẽ tạo một danh sách trái cây nhỏ bằng HTML 5 và hiển thị danh sách hộp kiểm đó để người dùng chọn nhiều tùy chọn. Chúng ta sẽ lấy nhiều giá trị của các hộp kiểm đã chọn với PHP 8 và tìm hiểu cách triển khai xác thực nhiều hộp kiểm trong PHP
Nếu bạn đang bắt đầu sử dụng PHP, thì hãy xem các bài viết chi tiết của chúng tôi về Xây dựng API CRUD REST trong PHP và MySQL và Nhận nhiều giá trị tùy chọn được chọn trong PHP
Tạo biểu mẫu với nhiều hộp kiểm
Tạo biểu mẫu bằng phần tử biểu mẫu HTML, xác định trường nhập liệu với giá trị type="checkbox". checkArr[] là một đối tượng mảng được định nghĩa trong tên-giá trị, được sử dụng để giao tiếp với PHP
Apple
Banana
Coconut
Blueberry
Đọc nhiều giá trị từ các hộp kiểm đã chọn
Phương thức isset[$_POST[‘submit’]] kiểm tra xem giá trị gửi có được khai báo hay không
Trong hàm isset, chúng tôi đang sử dụng một xác thực khác và đảm bảo liệu các giá trị của hộp kiểm có được đặt hay không bằng cách sử dụng hàm empty[]
Sử dụng vòng lặp foreach[] để lặp lại mọi giá trị đã chọn của các hộp kiểm và in trên màn hình người dùng
Xác thực hộp kiểm trong PHP
Để thêm xác thực vào các hộp kiểm, hãy đặt đoạn mã sau vào mẫu PHP của bạn
Hộp kiểm với Kiểu tùy chỉnh
Thêm thẻ span bên dưới trường đầu vào để thêm kiểu dáng tùy chỉnh trong các hộp kiểm
Apple
Banana
Coconut
Blueberry
Hộp kiểm kiểu chỉ với HTML và CSS
label {
display: block;
position: relative;
padding-left: 35px;
margin-bottom: 20px;
cursor: pointer;
font-size: 22px;
-webkit-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
line-height: 25px;
}
/* Hide the browser's default checkbox */
label input {
position: absolute;
opacity: 0;
cursor: pointer;
height: 0;
width: 0;
}
/* Create a custom checkbox */
span {
position: absolute;
top: 0;
left: 0;
height: 25px;
width: 25px;
background-color: #cccccc;
}
label:hover input~span {
background-color: #cccccc;
}
label input:checked~span {
background-color: #1A33FF;
}
span:after {
content: "";
position: absolute;
display: none;
}
label input:checked~span:after {
display: block;
}
label span:after {
left: 9px;
top: 5px;
width: 5px;
height: 10px;
border: solid white;
border-width: 0 3px 3px 0;
-webkit-transform: rotate[45deg];
-ms-transform: rotate[45deg];
transform: rotate[45deg];
}Ví dụ mã hộp kiểm PHP 8 cuối cùng
Đây là ví dụ mã hoàn chỉnh cho các hộp kiểm trong PHP
doctype html>
PHP - Get Multiple Checkbox Value DEMO
Apple
Banana
Coconut
Blueberry
Sự kết luận
Trong hướng dẫn này, chúng ta đã học cách làm việc với các hộp kiểm. Chúng ta đã thấy cách lấy nhiều giá trị và triển khai xác thực trong PHP
máy đào
Tôi là Digamber, một nhà phát triển full-stack và là người đam mê thể dục. Tôi đã tạo trang web này để truyền kinh nghiệm mã hóa của mình cho các lập trình viên mới. Tôi thích viết trên JavaScript, ECMAScript, React, Angular, Vue, Laravel
Twitter GitHubBài viết đề xuất
Xây dựng hệ thống xếp hạng 5 sao PHP MySQL bằng jQuery AJAXPHP 8 Tìm kiếm dữ liệu trực tiếp AJAX với MySQL Hướng dẫn PHP 8 Select2 Đa lựa chọn với jQuery AJAX Hướng dẫn PHP 8 Ví dụ về mã hóa và giải mã dữ liệu JSON Ví dụ về PHP 8 Hướng dẫn xác thực biểu mẫu phía máy chủ Tích hợp Google reCAPTCHA trong PHP 8 Biểu mẫu liên hệ Cách tạo Captcha . Lấy giá trị đã chọn và thêm kiểu Cách lấy các giá trị đã chọn từ tùy chọn được chọn trong PHP 8Tạo phân trang trong PHP 8 với MySQL và BootstrapBuild Biểu mẫu đăng ký [đăng ký] người dùng PHP 8 với MySQL