Khác biệt quyết định nằm ở giá trị có được gửi lên server hay không.
html
<input name="code" value="HD-2026-001" readonly> <!-- GỬI kèm form -->
<input name="promo" value="SALE50" disabled> <!-- KHÔNG gửi -->readonly | disabled | |
|---|---|---|
| Sửa được | không | không |
| Focus / tab tới | được | không |
| Bôi đen, copy | được | không |
| Gửi kèm form | có | không |
| Giao diện mặc định | như thường | mờ đi |
Nhận :disabled trong CSS | không | có |
Chọn thế nào: hiển thị giá trị hệ thống sinh ra mà server vẫn cần nhận lại (mã đơn, tổng tiền đã tính) → readonly. Field không áp dụng trong ngữ cảnh hiện tại → disabled.
Lưu ý 1: dùng disabled cho ô "Tổng tiền" thì server không nhận được giá trị đó. Muốn field vẫn được gửi lên server nhưng hiển thị mờ, dùng readonly kèm CSS.
Lưu ý 2: readonly không áp dụng cho <select>, <input type=checkbox|radio>. Với các control này chỉ có disabled, và nếu vẫn cần gửi giá trị thì thêm <input type="hidden"> đi kèm.