Magento 2 Show Ajax Loader Widget

In this article, you can see a discussion regarding Magento 2 Show Ajax Loader Widget in detail and step by step in a simple way.

If you are looking for this topic then you are at right place.

Let’s start with the topic Magento 2 Show Ajax Loader Widget

It is very easy to show loader widget icon on Ajax call request in case of Magento.

The main important thing in case of showing loader is the Ajax request.

Once the Ajax is request, loader get displayed.

It is totally depends on you regarding displaying of loader.

As the response of loader get completed or get finished you can stop the loader as per your requirement.

Now the step is to add this loader widget icon on a required web page using Ajax request.

Use the below line of code for starting the loader widget.

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

For disabling loader widget use the below line code.

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

Below the complete code snippet for adding loader widget.

Use the below code.

<script>
    require(['jquery','domReady!'], function ($, urlBuilder, $t) {
        // start loader
        $('body').trigger('processStart');
        $.ajax({
            url: urlString,
            data: {},
            type: 'POST',
            dataType: 'json',
        }).done(function (response) {
        	//stop loader
            $('body').trigger('processStop');
        }).fail(function (response) {
        	//stop loader
            $('body').trigger('processStop');
        });
    });
</script>

As you can see in the above code snippet, added a line code to show the loader before Ajax request.

After the Ajax request is done used code for stopping the Ajax loader.

Magento 2 Get Product Image Url in phtml

Conclusion :

Finally we done with the point of hiding featured image.

I hope you like this article and if you think that i have missing something, please comment below.

Leave a Comment