Thêm nút gửi vào biểu mẫu

Ngày đăng: 25/10/2018 - Cập nhật: 20/07/2019

Mục Lục

Bạn đã tạo được 1 form rồi, đã có input để cho người dùng nhập dữ liệu, đã có hành động ẩn đằng sau là action.

Tuy nhiên, làm sao biết được thời điểm nào thì thực hiện action??

Để giải quyết vân đề này thì chúng ta phải có một nút để người dùng bấm submit khi đã nhập dữ liệu xong.

Hãy thêm nút submit vào biểu mẫu của bạn. Nhấp vào nút này sẽ gửi dữ liệu từ biểu mẫu của bạn đến URL bạn đã chỉ định với thuộc tính action của biểu mẫu.

Dưới đây là một nút submit:

            <button type="submit">Đây là nút submit</button>

Bài tập

Thêm một nút submit vào phía cuối cùng của phần tử form của bạn với type='submit’, và văn bản hiển thị là Gửi.

            <h2>CatPhotoApp</h2>
<main>
  <p>Click here to view more <a href="#">cat photos</a>.</p>
  
  <a href="#"><img src="https://bit.ly/fcc-relaxing-cat" alt="A cute orange cat lying on its back."></a>
  
  <p>Things cats love:</p>
  <ul>
    <li>cat nip</li>
    <li>laser pointers</li>
    <li>lasagna</li>
  </ul>
  <p>Top 3 things cats hate:</p>
  <ol>
    <li>flea treatment</li>
    <li>thunder</li>
    <li>other cats</li>
  </ol>
  <form action="/submit-cat-photo">
    <input type="text" placeholder="cat photo URL">
  </form>
</main>

Về trang trước Bài tiếp theo

Gửi email in trang