Jak dodać JavaScript do widoku?

26

Mam w swojej witrynie widok, który ma określoną nazwę klasy. Chcę wiedzieć w pliku szablonu.php motywu, skąd mogę wiedzieć, czy widok o określonej nazwie klasy jest dostępny na żądanej stronie.

Jest to dla mnie bardzo ważne, ponieważ muszę dołączyć określony kod JavaScript i CSS, gdy na stronie używany jest widok o określonej nazwie klasy (takiej jak galeria obrazów).

Mehrdad201
źródło

Odpowiedzi:

40

Możesz użyć template_preprocess_views_view()haka, aby to zrobić:

function THEME_preprocess_views_view(&$vars) {
  $view = &$vars['view'];
  // Make sure it's the correct view
  if ($view->name == 'your-view-name') {
    // add needed javascript
    drupal_add_js(drupal_get_path('theme', 'your-theme') . '/your-js.js');
    // add needed stylesheet
    drupal_add_css(drupal_get_path('theme', 'your-theme') . '/your-css.css');
  }
}

Pamiętaj, że możesz również sprawdzić konkretne wyświetlanie widoku, używając:

if ($view->name == 'your-view-name' && $view->current_display == 'your-display-id') {
  // include javascript & css here
}

Powinieneś być w stanie sprawdzić niestandardową klasę css, taką jak ta:

if ($view->name == 'your-view-name' && $view->display[$view->current_display]->display_options['css_class'] == 'your-css-class') {
   // include javascript & css here
}
Kod cyklonowy
źródło
Wielkie dzięki, ale ta funkcja rozpoznaje widok po nazwie. Chcę rozpoznać nazwę klasy, ponieważ na jednej stronie jest kilka widoków o tej samej nazwie. na przykład 2 widoki mają nazwę klasy „galeria-obraz”, a 3 widoki mają nazwę klasy „light-box”. Chcę dodać js na przykład, jeśli widok z nazwą klasy css „light-box” jest dostępny na stronie.
Mehrdad201
Nie możesz po prostu sprawdzić wyświetlacza? if($view->name == 'your-view-name' && $view->display_id == 'your-display-id')
Kod cyklonowy
nie, ponieważ nie jest jasne, ile wyświetleń jest dostępnych na stronie. może zjadło 10 widoków, że wszystkie mają tę samą nazwę klasy css.
Mehrdad201 24.04 .12
Zaimplementowałem ten hak i opróżniłem wszystkie pamięci podręczne - ale nie został wywołany. Nie pewny dlaczego. Tak, dwukrotnie sprawdziłem nazwę.
jdhildeb
To wydaje się bardzo dziwne? Zastąpiłeś THEME nazwą swojego aktualnego motywu? Powinno to działać dobrze, o ile poprawnie go zaimplementujesz.
Kod cyklonowy
8

Możesz użyć funkcji views_get_page_view, aby dowiedzieć się, który widok jest wyświetlany na stronie. Zwraca obiekt widoków. Zauważ, że w poniższym fragmencie kodu powinieneś porównać z nazwą do odczytu maszynowego, ale oczywiście możesz napisać własne porównanie na podstawie obiektu widoku zwróconego przez views_get_page_view

function YOURTHEMENAME_preprocess_page(&$variables) {
    $view = views_get_page_view();
    if($view->name == 'YOURVIEW') {
    //Do what ever you want 
    }
Alex Petrov
źródło
6

Na wszelki wypadek przydaje się to każdemu, kto natknie się na to pytanie, szukając tak jak ja, aby dołączyć JavaScript do widoku Drupala . Jeśli chodzi o D7 i widoki 3.7, dla mnie najlepiej działały:

function HOOK_views_pre_render ( &$view ) { 
  /// check to make sure the view has a classname
  if ( $view->display_handler && !empty($view->display_handler->options['css_class']) ) {
    $cln = $view->display_handler->options['css_class'];
    $cls = 'CLASS GOES HERE';
    /// test that the classname contains our class
    if ( preg_match('/(^|\s+)' . preg_quote($cls) . '(\s+|$)/i', $cln) ) {
      /// build the path to the js, which is local to my module, js/view.js
      $sep = DIRECTORY_SEPARATOR;
      $dir = rtrim(drupal_get_path('module', 'HOOK'), $sep);
      $pth = "{$dir}{$sep}js{$sep}view.js";
      drupal_add_js($pth);
    }
  }
}

Było to korzystne, ponieważ chciałem zachować kod w moim module, a nie w motywie - ponieważ ulepszenia wprowadzone przez JavaScript nie miały nic wspólnego z wyglądem.

UWAGA: Oczywiście HOOKnależy zastąpić nazwą modułu w obu lokalizacjach, a CLASS GOES HEREtakże klasą, której szukasz.

Pebbl
źródło
Dla jasności, dlaczego pre_render był lepszy niż pre_process?
Nick
@Nick ~ Nie ma HOOK_views_pre_process( api.drupal.org/api/views/views.api.php/7 ), chyba że masz na myśli powód, dla którego chcesz z niego korzystać THEME_preprocess_views_view- w takim przypadku nie jest to zależne od tego, gdzie chcesz dodać swoje modyfikacje kodu. HOOK_views_pre_rendermoże zostać podłączony z modułu, podczas gdy THEME_preprocess_views_viewpowinien przejść do pliku motywu / szablonu. Możesz także użyć, HOOK_views_post_renderjeśli wolisz.
Pebbl
Przepraszam, miałem na myśli THEME_preprocess_views_view, tak ... Jestem pewien, że zrobiłem to wcześniej hook_preprocess_views_vieww modułach.
Nick
4

Jeśli korzystasz z drupala 6 lub 7, możesz również dołączyć zasoby javascript do kontekstu modułu i dodać zasoby. Co wymaga kontekstu, ale będziesz mieć pewność, że będzie on zawsze uwzględniany podczas renderowania widoku.

https://drupal.org/project/context_addassets

Na stronie projektu modułu:

Czy kiedykolwiek chciałeś dołączyć javascript lub css podczas renderowania określonego widoku lub bloku? Czy może kiedykolwiek chciałeś dołączyć javascript lub css tylko na pierwszej stronie bez konieczności pisania kodu?

Kontekstowe dodawanie zasobów pozwala to zrobić. Ma łatwy w użyciu interfejs użytkownika, który pozwala to wszystko robić bez pisania kodu. Ponieważ używa narzędzi ctools, wszystko to można również eksportować.

chrisjlee
źródło
2

Napisz kod JavaScript, który wyszukuje określoną klasę w widoku, używając funkcji jCluery hasClass () i dołącz plik JavaScript, gdy warunek zostanie spełniony.

Innym sposobem jest wstawienie szablonu do widoku i dodanie kodu JavaScript przez ten szablon za pomocą drupal_add_js () .

niksmac
źródło
Czy możesz mi powiedzieć, jak mogę to zrobić. Rzeczywiście, w jaki sposób można dołączyć pliki css i js po wyrażeniu warunkowym w skrypcie Java?
Mehrdad201
W przypadku Drupala 8 ta odpowiedź opisuje, jak utworzyć niestandardowy szablon widoku dla wyniku wyświetlania, aby to zrobić: stackoverflow.com/a/43131240/227926
therobyouknow