0

When we add a facet block to the page, a filter is selected and the page starts to load the results. However there is no loading icon or indicator the change is being applied.

When we check the page, there is no JS error and nothing visible.

How do we get the loading icon or throbber to show when a facet is selected?

1
  • Sorry I don't have time to test & write a proper answer, but you may be able to use hook_form_alter() to add the throbber to the form element filter such as $form['my_form']['facet_filter_1']['#ajax'] = ['event' => 'keyup', 'progress' => [ 'type' => 'throbber', 'message' => NULL ]]; - for more info checkout api.drupal.org/api/drupal/… && drupal.org/docs/8/api/javascript-api/ajax-forms
    – 100pic
    Jul 3, 2019 at 2:00

1 Answer 1

1

You can try the following.

Add in your JS file:

$(document).ajaxStart(function(){
  $('#ajax_loading').show();
});

$(document).ajaxStop(function() {
  $('#ajax_loading').hide();
});

Add the HTML in your page:

<div id="ajax_loading" style="display:none">

Add in your CSS file:

#ajax_loading {
  position: fixed;
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
  background: rgba(0,0,0,0.5);
  z-index: 9999;
}

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.

Not the answer you're looking for? Browse other questions tagged or ask your own question.