tôi đang khớp nối thương mại Drupal, DC thêm vào giỏ hàng ajax và mô-đun flyout thương mại.
Đây là cấu hình xem của tôi:
Về tôi /xe đẩy
trang, tôi có biểu mẫu ban đầu (chế độ xem) để thay đổi số lượng, xóa các mục, v.v...
Tôi cũng có một thanh trượt sản phẩm, nhờ mô-đun "ajax thêm vào giỏ hàng", tôi có thể thêm một số sản phẩm vào giỏ hàng.
Các hành vi dự kiến:
- Bất cứ khi nào tôi cập nhật số lượng hoặc xóa một mặt hàng khỏi hộp thả xuống, biểu mẫu cần được cập nhật (bao gồm cả tổng số)
- Bất cứ khi nào tôi cập nhật số lượng hoặc xóa một mặt hàng khỏi biểu mẫu, hộp thả xuống cần được tải lại (bao gồm cả tổng số)
- Bất cứ khi nào tôi cập nhật số lượng hoặc xóa khỏi thanh trượt, cả hộp thả xuống và biểu mẫu đều phải được cập nhật.
Trong js, tôi đã cố gắng kích hoạt chúng riêng lẻ sau khi các nút đã được nhấp, bằng cách gọi mã ajax tùy chỉnh để xây dựng lại chế độ xem và hộp thả xuống.
/**
* Tải lại toàn bộ nội dung trang xem (hình thức)
*/
chức năng xây dựng lạiViewPanier() {
//$("#commerce_cart_form-cart-ajax-wrapper").triggerHandler("RefreshView");
$.ajax({
url: "/ajax_update_cart_panier"
}).done(hàm (dữ liệu) {
if (dữ liệu[3] !== không xác định) {
để bộ chọn = data[3]["bộ chọn"];
để dataReplace = data[3]["data"];
hãy chặn = $(bộ chọn);
block.html($(dataReplace));
}
});
}
/**
* Mã từ mô-đun thả xuống
*/
chức năng xây dựng lạiBlockCart() {
let el = document.querySelector(".cart-flyout");
// Drupal.cartFlyout.createFlyout();
hãy cài đặt = drupalSettings.cartFlyout;
settings.use_quantity_count = true;
var model = new Drupal.cartFlyout.CartBlockModel(cài đặt);
Drupal.cartFlyout.models.push(mô hình);
var view = new Drupal.cartFlyout.CartBlockView({
el: el,
người mẫu: người mẫu
});
var offcanvasView = new Drupal.cartFlyout.CartOffcanvasView({
địa chỉ: Drupal.cartFlyout.offcanvas,
người mẫu: người mẫu
});
Drupal.cartFlyout.views.push(xem);
Drupal.cartFlyout.views.push(offcanvasView);
Drupal.cartFlyout.fetchCarts();
}
Hành vi thực tế: hiện tại, những tương tác giữa 3 phần đó của trang là như thế này
- Thanh trượt -> bay ra :: đang hoạt động (tự động)
- Biểu mẫu -> thanh trượt :: đang hoạt động (tự động)
- Thanh trượt -> biểu mẫu :: KO (khi tôi tải lại thủ công)
Và đây là thanh trượt-->hình thức mà tôi bị mắc kẹt.
Biểu mẫu không được tải lại (vì vậy tôi đã tạo chức năng ajax để tải thủ công).
Đây là cách tôi xây dựng lại nó:
$view_name = "commerce_cart_form";
$display_id = "mặc định";
$view = [
'#type' => 'xem',
'#name' => $view_name,
'#display_id' => $display_id,
'#arguments' => [$cart_id],
'#embed' => ĐÚNG,
];
$content = \Drupal::service('renderer')->render($view);
$response = new AjaxResponse();
return $response->addCommand(new ReplaceCommand('#commerce_cart_form-cart-ajax-wrapper', $content));
Biểu mẫu được xây dựng lại, nhưng tôi đang mất bất kỳ sự kiện nào trên nút ajax để cập nhật giỏ hàng.
HTML ban đầu
<form data-drupal-selector="views-form-commerce-cart-form-default-26" action="/cart" method="post"
id="views-form-commerce-cart-form-default-26" accept-charset="UTF-8" data-once="form-updated"
data-drupal-form-fields="edit-dc-ajax-add-cart-views-edit-quantity-0,edit-remove-button-0,edit-dc-ajax-add-cart-views-edit-quantity-1,edit-remove-button-1,edit-dc-ajax-add-cart-views-edit-quantity-2,edit-remove-button-2,edit-dc-ajax-add-cart-views-edit-quantity-3,edit-remove-button-3,edit-dc-ajax-add-cart-views-edit-quantity-4,edit-remove-button-4,edit-coupon-redemption-code,edit-coupon-redemption-apply,edit-submit,edit-checkout">
HTML sau khi tải lại:
<form data-drupal-selector="views-form-commerce-cart-form-default-26" action="/ajax_update_cart_panier" method="post" id="views-form-commerce-cart-form-default-26" accept-charset="UTF-8">
Như bạn có thể thấy, tôi đang sử dụng tất cả các trường biểu mẫu dữ liệu drupal của mình. Có phải vì điều đó mà biểu mẫu ban đầu không tải lại thủ công không?
Các triggerHandler('RefreshView') được gọi như 10 lần khi nó được gọi (khoảng 15/20 giây để làm mới chế độ xem, không gặp sự cố đó trước khi cập nhật phiên bản cốt lõi), đó là lý do tại sao tôi quyết định sử dụng ajax tùy chỉnh để xây dựng lại chế độ xem.
Tôi đang sử dụng phiên bản mới nhất của các mô-đun và tôi đang sử dụng drupal 9.3.7