Radio button và checkbox là gì?
Còn gọi: nút chọn và ô đánh dấu
Radio button cho phép chọn đúng một mục trong một nhóm lựa chọn loại trừ nhau, còn checkbox cho phép chọn không, một hoặc nhiều mục độc lập.
Hiểu kỹ hơn
Hai thành phần này trông gần giống nhau nhưng khác hẳn về logic. Radio button là các vòng tròn, chọn mục này thì mục kia tự bỏ, dùng khi người dùng phải chọn một, ví dụ phương thức giao hàng. Checkbox là các ô vuông, mỗi ô bật tắt độc lập, dùng cho danh sách chọn nhiều như bộ lọc thương hiệu, hoặc một ô riêng như Đồng ý điều khoản. Checkbox còn có trạng thái lưng chừng (indeterminate) khi chỉ một phần mục con được chọn. Trong Figma, mỗi loại nên là component có variant Checked, Unchecked, Disabled và vùng bấm bao cả nhãn chữ. Ví dụ: trang thanh toán dùng radio cho Giao tiêu chuẩn hay Giao nhanh và checkbox cho Xuất hoá đơn. Lỗi thường gặp là dùng checkbox cho lựa chọn loại trừ nhau, hoặc vùng bấm chỉ là ô 16px khiến khó chạm trên điện thoại.
