Jak zmienić zachowanie ładowania ajax w Widokach?

Mam widok z niektórymi odsłoniętymi filtrami w bloku; używa AJAX i funkcji automatycznego przesyłania, więc widok jest ładowany ponownie, gdy tylko zmieni się opcja filtru.

W krótkim opóźnieniu między wybraniem opcji a ponownym załadowaniem widoku, znajomy niebieski pulsujący AJAX jest wyświetlany gdzieś u dołu formularza (myślę, gdzie obecnie znajduje się ukryty przycisk wysyłania).

Wiem, że mogę dostosować ten obraz, zastępując CSS dla elementu throbber, ale wolałbym go wcale nie używać.

Wolałbym tymczasowo wyciemnić odsłoniętą formę filtra (a najlepiej także widok główny), używając animacji jQuery. Potem znikną po zakończeniu połączenia AJAX.

W przeciwnym razie chciałbym użyć tej samej metody, której używa moduł interfejsu użytkownika widoków podczas aktualizacji, mianowicie umieszczając tę ​​ikonę na środku strony:

Ponieważ jest to już wbudowane, po prostu założyłem, że będzie miejsce, w którym można zmienić styl / lokalizację tego ładowania; nie ma jednak szczęścia.

Jak wdrożyć jedną z tych metod?

Używam Drupal 7 z widokami 7.x-3.3.

Jeśli nie masz nic przeciwko użyciu małej jquery, zawsze możesz zrobić coś takiego:

$('#view-id').ajaxStart(function(){
   $('#view-filters-id').fadeTo(300, 0.5);
});
$('#view-id').ajaxSuccess(function(){
   $('#view-filters-id').fadeTo(300, 1.0);
});

Dla kompletności oto kod, którego ostatecznie użyłem; wycisza zarówno odsłoniętą formę filtra, jak i widok, gdy rozpoczyna się ładowanie AJAX, i wraca ponownie po zakończeniu:

(function($) {
  Drupal.behaviors.events = {
    attach: function(context, settings) {
      $('#views-exposed-form-events-page', context).ajaxStart(function(){
        $('#views-exposed-form-events-page,div.view-id-events', context).fadeTo(300, 0.5);
      });
      $('#views-exposed-form-events-page', context).ajaxSuccess(function(){
         $('#views-exposed-form-events-page', context).fadeTo(300, 1.0);
         $('div.view-id-events', context).css('opacity', 0.5).fadeTo(300, 1.0);
      });
    }
  };
})(jQuery);

Witaj, stworzyłem bardzo prosty moduł, który dozuje dokładnie to, co chcesz zrobić. Moduł ma stronę konfiguracji, na której można kontrolować styl pulsowania, a nawet przesyłać własne obrazy bez żadnego włamania.

To jest link do piaskownicy: http://drupal.org/sandbox/ANDiTKO/1556808

Jeśli okaże się przydatny, proszę ujawnij go tutaj, aby mógł zostać zatwierdzony jako oficjalny projekt: http://drupal.org/node/1556114

Właśnie przeprowadziłem badanie.
Jest throbberon zakodowany tutaj w konstruktorze Drupal.views.ajaxView.
Wystąpienie Drupal.views.ajaxViewnie jest przechowywane Drupal.ajaxi jest @todo o nim.
Oznacza to, że nie możemy wejść do obiektu i ustawić własnych parametrów.

Jak działa widok?

Krótka odpowiedź to CSS.
Strona administratora wyświetleń ukrywa się throbber i dodaje stylu jej rodzicowi .ajax-progress-throbber.

.ajax-progress-throbber {
  background-color: #232323;
  background-image: url("../images/loading-small.gif");
  background-position: center center;
  background-repeat: no-repeat;
  -moz-border-radius: 7px;
  -webkit-border-radius: 7px;
  border-radius: 7px;
  height: 24px;
  opacity: .9;
  padding: 4px;
  width: 24px;
}

Czy mogę coś zrobić z Drupal.ajax?

Tak, znalazłem metody, które można zastąpić dla elementów AJAX (przyciski, łącza itp.). Pokazałem tutaj przykład: jak przedłużyć lub „zaczepić” Drupal Form AJAX? . Ale w tym przypadku nie będzie tak dobrze.
Element postępu pokazuje się na beforeSendetapie, więc możesz coś zrobić, zanim to się stanie.