Input html là gì

Form html là gì? Các phần tử form thường sử dụng trong website.

• Phan Văn Cương
• February 26, 2020

Form html là một công cụ rất hữu ích trong website giúp người dùng có thể tương tác với hệ thống bằng cách nhập liệu form và gửi lên server. Form được dùng trong việc lấy bình luận người dùng, đăng nhập, đăng ký, đặt hang

Cấu trúc form

Trong đó:

• ... : Thẻ khai báo một form.
• action: Thuộc tính khai báo đường dẫn xử lý dữ liệu sau khi người dùng submit form.
• method: Thuộc tính khai báo phương thức xử lý dữ liệu bao gồm POST và GET.

Lưu ý: Phần action và method qua nội dung php bạn sẽ được nắm rõ hơn để khai báo. Còn trong quá trình xây dựng html tạm thời bạn cứ để trống.

Các phần tử form thường dùng

Input text nhập đoạn text ngắn

Đây là phần tử form dùng nhập text có số lượng ký tự ngắn như tên người dùng, địa chỉ, tiêu đề bài viết sản phẩm

Ví dụ bên dưới chúng ta tạo ra input nhập username

Input password nhập mật khẩu

Để lập những thông tin cần bảo mật như mật khẩu trong form có type = "password" giúp chúng ta nhập thông tin một cách an toàn.

Input submit gửi dữ liệu lên server

Khi đã nhập dữ liệu vào form để gửi nó lên server chúng ta cần khai báo input type = "submit". Khi người dùng nhấn vào nút submit dữ liệu sẽ được gửi lên server để xử lý.

Bên dưới là demo form đăng nhập bao gồm username, password, và một nút bấm đăng nhập.

Input email nhập địa chỉ email

Trong quá trình đăng ký tài khoản hoặc các form đăng ký nhận bản tin, giảm giá thì email là một phần không thể thiếu.

Để nhập liệu email chúng ta sử dụng input type = "email"

Input date nhập ngày tháng

Textarea nhập đoạn văn

Textarea thường dùng để nhập liệu đoạn văn dài như mô tả bài viết, nội dung bài viết, nội dung sản phẩm

Trong đó

• cols: Độ rộng của ô nhập liệu
• rows: Độ cao của ô nhập liệu

Input number nhập số lượng

Trong một số trường hợp dữ liệu nhập vào ở dạng số nguyên bạn có thể sử dụng type = "number". Phần này thường dùng trong chọn số lượng sản phẩm trong giỏ hàng.

Trong đó

• min: Thuộc tính khai báo giá trị bé nhất của dữ liệu.
• max: Thuộc tính khai báo gía trị lớn nhất của dữ liệu.
• value: Thuộc tính khai báo giá trị mặc định.

Checkbox hộp chọn nhiều

Trong trường hợp muốn khảo sát thông tin từ người dùng về một chủ đề có nhiều lựa chọn. Người dùng có thể chọn một hoặc nhiều option thì chúng ta sử dụng input = "checkbox".

Ví dụ bên dưới giúp người dùng khai báo kỹ năng của họ bao gồm html, css, php.

Lưu ý: Các checkbox có cùng một chủ đề bạn cần sử dụng có cùng giá trị của thuộc tính name

Radiobox hộp chọn một trong số

Khi muốn lấy thông tin của người dùng chỉ được chọn một trong số rất nhiều lựa chọn chúng ta sử dụng inputtype="radio".

Ví dụ bên dưới giúp người dùng chọn giới tính của mình.

Selectbox chọn qua thanh xổ

Một chức năng thường dùng select chính là thanh chọn vị trí tỉnh/thành phố đang ở.

Tổng kết

Trong bài này tôi đã giới thiệu với bạn về form html và những phần tử form thường dùng trong website. Đây là một nội dung quan trong nên bạn cần ghi chú lại và thực hành từng bước để nắm chắc bài học.

Xin chào, sớm hẹn gặp lại!

PrevTrướcCookie: Lưu trữ dữ liệu ngay trên trình duyệt của người dùng với Php

SauĐệ quy là gì? Cách sử dụng giải thuật đệ quy trong phpNext

Mọi người thường xem

Subscribe

Login

Notify of

Label

{} [+]

Label

{} [+]

0 Comments

Inline Feedbacks

View all comments

Bạn muốn kiếm tiền từ kỹ năng lập trình web?

Lộ trình 10 bước có nhóm kín kèm cặp và trên 2.500 người học và đã đi làm với thu nhập 8-30tr/tháng

Bắt đầu ngay