Biểu mẫu

Biểu mẫu trong Odoo rất mạnh mẽ. Chúng được tích hợp trực tiếp với các ứng dụng khác và có thể được sử dụng cho nhiều mục đích khác nhau.

Trong chương này, bạn sẽ khám phá cách:

  • Thêm một biểu mẫu vào theme tùy chỉnh của bạn.

  • Thay đổi hành động của biểu mẫu.

  • Tạo kiểu cho biểu mẫu nhờ các biến Bootstrap.

Biểu mẫu mặc định

Để thêm một biểu mẫu vào trang, hãy sao chép và dán đoạn code được Website Builder tạo ra vào trang.

Nó sẽ trông giống như sau.

<form
   action="/website/form/" method="post"
   enctype="multipart/form-data"
   class="o_mark_required"
   data-mark="*" data-pre-fill="true"
   data-success-mode="redirect"
   data-success-page="/contactus-thank-you"
   data-model_name="mail.mail">
     <div class="s_website_form_rows row s_col_no_bgcolor">
          <div class="form-group s_website_form_field col-12 s_website_form_dnone" data-name="Field">
               <!-- Form fields -->
           </div>
     </div>
</form>

Actions

Có một data-model_name trong thẻ form. Nó cho phép bạn xác định các hành động khác nhau cho biểu mẫu của mình.

Gửi email (hành động này được sử dụng theo mặc định).

<form data-model_name="mail.mail">

Ứng tuyển công việc.

<form data-model_name="hr.applicant">

Tạo khách hàng.

<form data-model_name="res.partner">

Tạo ticket.

<form data-model_name="helpdesk.ticket">

Tạo cơ hội.

<form data-model_name="crm.lead">

Tạo nhiệm vụ.

<form data-model_name="project.task">

Ghi chú

Hành động mặc định là Send an E-mail nhưng tùy theo các ứng dụng được cài đặt trong cơ sở dữ liệu, có thể tìm thấy một số tùy chọn khác, chẳng hạn như: Ứng tuyển công việc, tạo khách hàng, tạo ticket, tạo cơ hội, v.v.

Xin lưu ý rằng một số hành động này có thể cần các trường bắt buộc cụ thể để hoạt động. Để không bỏ sót các yêu cầu, chúng tôi khuyến nghị mạnh mẽ bạn nên thiết lập trước snippet biểu mẫu bằng Website Builder và sao chép/dán mã nguồn được tạo ra.

Thành công

Xác định điều gì xảy ra sau khi biểu mẫu được gửi nhờ thuộc tính data-success-mode.

Chuyển hướng người dùng đến một trang được xác định trong data-success-page.

<form data-success-mode="redirect" data-success-page="/contactus-thank-you">

Hiển thị một thông báo (trên cùng trang).

<form data-success-mode="message">

Thêm một thông báo thành công trực tiếp bên dưới thẻ form. Luôn thêm class d-none để đảm bảo thông báo thành công bị ẩn nếu biểu mẫu chưa được gửi.

<div class="s_website_form_end_message d-none">
     <div class="oe_structure">
          <section class="s_text_block pt64 pb64" data-snippet="s_text_block">
               <div class="container">
                     <h2 class="text-center">This is a success!</h2>
               </div>
          </section>
     </div>
</div>