Hành động của biểu mẫu

Chọn phần tử Biểu mẫu trên trang, mở nhóm Hành động (en: Action) trong bảng thuộc tính bên phải. Biểu mẫu không có mốc Khi nhấp — nút Gửi là việc của khối biểu mẫu, không phải của phần tử này — mà có ba mốc riêng: Trước khi gửi, Sau khi gửi thành công, Sau khi gửi thất bại. Mỗi mốc là một danh sách kéo thả của riêng nó.

---

Nhiều hành động, có thứ tự

Một mốc không còn chỉ nhận đúng một hành động. Thêm hành động ở cuối mỗi danh sách thêm được bao nhiêu hàng cũng được, mỗi hàng là một hành động độc lập với ô chọn và các trường riêng của nó; nút ✕ (Bỏ hành động này) gỡ một hàng, tay cầm ⠿ kéo để đổi thứ tự. Hành động chạy đúng theo thứ tự hiện trên màn hình, từ trên xuống.

Trước khi gửi và Sau khi gửi thất bại dùng chung một danh sách: Mở pop-up, Đóng pop-up, Mở giỏ hàng, Đóng giỏ hàng — không có gì rời trang, vì lúc đó biểu mẫu còn chưa xong việc hoặc vừa bị từ chối. Sau khi gửi thành công có thêm ba hành động rời trang: Mở liên kết, Mở trang, Đến thanh toán.

Sau khi gửi thất bại chỉ chạy khi MÁY CHỦ từ chối — một câu trả lời máy chủ kiểm lại và không chấp nhận, giỏ hàng trống, một sản phẩm đã hết hàng, một mã giảm giá bị từ chối — hoặc khi chính yêu cầu gửi đi thất bại (khách mất mạng). Một ô bắt buộc khách bỏ trống, một câu trả lời sai định dạng: cả hai bị chặn ngay trên trang, trước khi có gì được gửi đi, nên mốc này không chạy cho chúng. Đặt một hành động Mở pop-up ở đây rồi mong nó bắt được ô trống là mong nhầm chỗ.

"Hành động này chuyển trang nên các hành động phía sau sẽ không chạy — kéo nó xuống cuối."

Đó là lời nhắc hiện ngay dưới một hàng, khi hàng đó rời trang mà không phải hàng cuối của mốc: mọi hành động xếp sau nó sẽ không bao giờ chạy, vì trang đã đi nơi khác rồi. Kéo hàng đó xuống cuối là hết cảnh báo.

Trước khi gửi không chặn được lần gửi

Trước khi gửi không bao giờ chặn được việc gửi, dù một hành động trong đó thất bại hay chưa sẵn sàng. Mốc này chỉ làm những việc phụ — mở một pop-up, mở giỏ hàng — trong lúc lần gửi vẫn đang đi tiếp phía sau; nó không đứng chắn đường. Cần một luật thật sự từ chối được lần gửi, kiểu "chưa đủ hai tiếng trước giờ đặt" hay "email này đã dùng rồi", thì đây không phải chỗ viết nó — xem mục Nối mã của riêng bạn bên dưới.

Sau khi gửi thành công, và dòng chữ "Sau khi gửi"

Thẻ Cài đặt của biểu mẫu (mở bằng Sửa biểu mẫu) có một ô riêng tên Sau khi gửi — dòng chữ thay cho biểu mẫu ngay khi khách gửi xong, ví dụ "Cảm ơn bạn! Chúng tôi đã nhận được thông tin."

Với biểu mẫu đặt hàng, dòng chữ này có thể chứa {orderNumber}: chỗ đó sẽ được thay bằng số đơn vừa tạo (ví dụ "#1001"). Để trống thì câu mặc định đã sẵn có số đơn: "Đơn #1001 đã được ghi nhận. Cảm ơn bạn!". Mã tuỳ chỉnh nhận cùng con số qua e.detail.orderNumber của wb:form:success.

Chuỗi hành động của Sau khi gửi thành công chạy TRƯỚC dòng chữ đó. Nếu chuỗi có một hành động rời trang — Mở liên kết, Mở trang, Đến thanh toán — trang đã đi nơi khác trước khi dòng chữ kịp hiện ra: hành động rời trang luôn thắng. Không có hành động rời trang nào trong chuỗi thì dòng chữ hiện lên như mọi khi, không gì đổi khác.

---

Ba mốc trên là những gì biểu mẫu tự làm được, không cần viết một dòng mã nào. Hai lối khác để gắn luật của riêng cửa hàng vào một biểu mẫu:

Nối mã của riêng bạn

Xem Nối mã của bạn vào biểu mẫu — trang đó nói đầy đủ về ba sự kiện DOM một biểu mẫu phát ra trên trang đã xuất bản: wb:form:submit (huỷ được, với reject(<ID trường>, <lời nhắn>)), wb:form:success, wb:form:error. Đây là chỗ viết những luật của riêng cửa hàng mà không ô chọn nào lo nổi: chỉ nhận đặt bàn trước hai tiếng, chặn mười tên miền email dùng một lần.

Đáng nói ở đây: wb:form:submit phát ra TRƯỚC mốc Trước khi gửi của mục này. Mã của bạn gọi reject(...) thì lần gửi bị huỷ và chuỗi hành động Trước khi gửi không chạy nữa — hệt như một lỗi định dạng của chính nền tảng.

Webhook form.submitted

Quản lý → Cài đặt → Webhook có sự kiện Biểu mẫu được gửi (en: Form submitted, mã form.submitted) — xem Webhook cho cách đăng ký một điểm nhận và những điều sẽ làm bạn bất ngờ (trùng lặp, không thứ tự, chuỗi bí mật ký).

Sự kiện này phát cho mọi lượt gửi đã lưu — kể cả một đơn mà giỏ hàng đã đổi tay trước khi máy chủ kịp tạo đơn thật (JSON mang sinkError nói vì sao) — nhưng không bao giờ phát cho một lượt bị từ chối: reject() từ mã của bạn, một luật hiển thị, một định dạng sai, hay một yêu cầu chưa từng tới được máy chủ.

Payload, một lượt gửi bình thường:

{
  "submissionId": "sub_...",
  "formId": "form_...",
  "formName": "Đặt bàn",
  "formType": "custom",
  "pageId": "pg_...",
  "submittedAt": "2026-09-06T10:00:00Z",
  "values": { "email": "khach@vidu.com" },
  "files": [{ "field": "cv", "name": "cv.pdf", "url": "https://...", "size": 102400 }],
  "orderId": "order_...",
  "orderNumber": "#1001",
  "customerId": "cus_..."
}

values đánh khoá bằng ID trường — đúng khoá wb:form:submit cũng dùng, nên một luật viết cho sự kiện DOM đọc được ngay dữ liệu webhook mà không phải đổi tên khoá nào. Trường mật khẩu không bao giờ có mặt trong values.

Năm khoá — pageId, orderId, orderNumber, customerId, sinkError — vắng mặt hẳn khi không có gì để báo, chứ không phải một chuỗi rỗng: orderId/orderNumber/customerId chỉ có khi lượt gửi đó tạo ra đơn hàng hoặc gắn được vào một hồ sơ khách hàng, và sinkError chỉ xuất hiện khi biểu mẫu đã lưu được câu trả lời nhưng phần tạo đơn phía sau thất bại — khi đó orderId cũng vắng mặt, vì không có đơn nào được tạo:

{ "sinkError": "product prod_9 is out of stock" }