Cách triển khai widget Loader trong magento2

9

Tôi muốn triển khai widget loader trong magento 2, Ở dạng của tôi, tôi đã đặt một nút

<div style="display:inline; float:right;  width:100%; margin-bottom:5px;">
    <button style="" class="scalable go" type="submit" id="button1"><span>Do some action</span></button>
</div>

Khi tôi nhấp vào nút này, tôi muốn gọi url (frontName / Controller / Action). Trong khi hành động này thực hiện tôi muốn hiển thị widget loader.

magento2 jquery widgets

— prasad maganti
nguồn

1

Khởi tạo widget được mô tả trong M2 devdocs: devdocs.magento.com/guides/v2.0/frontend-dev-guide/javascript/,

— Alex

31

Thật đơn giản một cách ấn tượng khi được sử dụng bên trong một tệp JS được tải thông qua Yêu cầu JS (Tất cả / hầu hết các tập lệnh của bạn sẽ không được nêu chi tiết về điều đó):

 $('body').trigger('processStart');

Và để loại bỏ nó

$('body').trigger('processStop');

Kết quả:

— Ben Crook
nguồn

17

Magento2 có widget tải .

Cách đơn giản để sử dụng nó với yêu cầu ajax.

$.ajax({
    ...// ajax setting,
    showLoader: true, // enable loader
    context: jqueryElementorSelector // element that will be coverer by loader, default body, optional
}).than(...)

Ngoài ra, bạn có thể tự sử dụng nó

<div data-role="pannel" data-mage-init='{"loader": {}}'>
     content
</div>

và trong JS

$('[data-role="pannel"]').trigger('show.loader'); // or .mage('loader', 'show')
....
$('[data-role="pannel"]').trigger('hide.loader');

— KAndy
nguồn

1

Tôi đang sử dụng showLoader: true bên trong các $.ajaxthiết lập. Tôi nhận được lỗi sau trong bảng điều khiển: Bạn có loader.js:210 Expected to start loader but did not find one in the dombiết tại sao điều này có thể xảy ra không? Tôi có phải thêm phần tử nạp vào DOM theo cách thủ công không? Tôi đang sử dụng một chủ đề tùy chỉnh, có lẽ tôi đã xóa một khối chứa trình tải mặc định?

— Shawn Northrop

0

Tôi đoán bạn muốn gọi trình tải trên cuộc gọi không phải là ajax

Giải pháp tạm thời: bạn có thể sử dụng khi gửi hoặc bất kỳ sự kiện nào khác: $ ('body') .loader ('show');

https://minhducnho.wordpress.com/2016/11/23/magento2-show-default-loader-in-magento/

nhưng tôi đoán đây không phải là cách magento để gọi widget của trình tải trong cuộc gọi không phải là ajax, tôi gặp vấn đề tương tự nên đã triển khai nó như một giải pháp tạm thời.

— Hemant Kumar
nguồn

0

Một cách đơn giản để hiển thị biểu tượng tải trong Magento sử dụng tập lệnh:

Để hiển thị trình tải:

jQuery('body').loader('show');

hoặc dùng:

var body = $('body').loader();
body.loader('show');

hoặc là

$('body').trigger('processStart');

Để ẩn bộ nạp:

var body = $('body').loader();
body.loader('hide');

HOẶC LÀ

jQuery('body').loader('hide');

HOẶC LÀ

jQuery('body').loader('destroy');

HOẶC LÀ

var body = $('body').loader();
body.loader('destroy');

HOẶC LÀ

$('body').trigger('processStop');

— ManiMara A
nguồn