Comment ajouter du JavaScript spécifique à une vue?

26

J'ai une vue dans mon site qui a un nom de classe spécifique. Je veux savoir, dans le fichier template.php d'un thème, comment je peux savoir si une vue avec un nom de classe spécifique est disponible dans la page demandée.

C'est très important pour moi car j'ai besoin d'inclure JavaScript et CSS spécifiques, lorsqu'une vue avec un nom de classe spécifique (comme galerie d'images) est utilisée dans une page.

Mehrdad201
la source

Réponses:

40

Vous pouvez utiliser le template_preprocess_views_view()crochet pour ce faire:

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');
  }
}

Notez que vous pouvez également vérifier l'affichage spécifique de la vue en utilisant:

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

Vous devriez être en mesure de rechercher une classe css personnalisée comme celle-ci:

if ($view->name == 'your-view-name' && $view->display[$view->current_display]->display_options['css_class'] == 'your-css-class') {
   // include javascript & css here
}
Cyclonecode
la source
Merci beaucoup, mais cette fonction reconnaît la vue par son nom, je veux reconnaître le nom de la classe, car il y a plusieurs vues dans une page qui ont le même nom de classe. par exemple, 2 vues ont un nom de classe «galerie-image» et 3 vues ont un nom de classe «boîte à lumière». Je veux ajouter js par exemple si une vue avec le nom de classe css «light-box» est disponible dans la page.
Mehrdad201
Vous ne pouvez pas simplement vérifier l'affichage? if($view->name == 'your-view-name' && $view->display_id == 'your-display-id')
Cyclonecode
non, car le nombre de vues disponibles sur la page n'est pas clair. peut-être y a-t-il eu 10 vues que toutes ont le même nom de classe css.
Mehrdad201
J'ai implémenté ce hook et vidé tous les caches - mais il n'a pas été appelé. Pas certain de pourquoi. Oui, j'ai revérifié le nom.
jdhildeb
Cela semble très étrange? Vous avez remplacé THEME par le nom de votre thème actuel? Cela devrait fonctionner très bien tant que vous l'implémentez correctement.
Cyclonecode
8

Vous pouvez utiliser la fonction views_get_page_view pour savoir quelle vue est diffusée sur la page. Il retourne l'objet vues. Notez que dans l'extrait de code ci-dessous, vous devez comparer avec le nom lisible par machine de vues, mais bien sûr, vous pouvez écrire votre propre comparaison en fonction de l'objet de vue retourné par 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
la source
6

Juste au cas où cela serait utile à quiconque tomberait sur cette question, en recherchant comme je l'ai fait pour attacher JavaScript à une vue Drupal . En termes de D7 et de vues 3.7, les éléments suivants ont fonctionné le mieux pour moi:

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);
    }
  }
}

C'était bénéfique car je voulais garder le code dans mon module, plutôt que le thème - parce que les améliorations apportées par le JavaScript n'avaient rien à voir avec l'apparence visuelle.

REMARQUE: il est évident que HOOKvous devez remplacer le nom de votre module aux deux emplacements et CLASS GOES HEREégalement le remplacer par la classe que vous recherchez.

Pebbl
la source
Pour plus de clarté, pourquoi pre_render était-il meilleur que pre_process?
Nick
@Nick ~ Il n'y a pas de HOOK_views_pre_process( api.drupal.org/api/views/views.api.php/7 ) à moins que vous ne vouliez dire pourquoi vous l'utilisez par dessus THEME_preprocess_views_view- auquel cas ce n'est que par préférence d'où vous souhaitez ajouter vos modifications de code. HOOK_views_pre_renderpeut être connecté à partir d'un module, alors qu'il THEME_preprocess_views_viewdevrait aller dans votre fichier de thème / modèle. Vous pouvez également utiliser HOOK_views_post_rendersi vous préférez.
Pebbl
Désolé, je voulais dire THEME_preprocess_views_view, oui ... Je suis sûr que j'ai déjà fait des hook_preprocess_views_viewmodules.
Nick
4

Si vous êtes sur drupal 6 ou 7, vous pouvez également inclure des actifs javascript avec le contexte du module ajouter des actifs. Ce qui nécessite un contexte, mais vous serez assuré qu'il sera toujours inclus lors du rendu de la vue.

https://drupal.org/project/context_addassets

Depuis la page projet du module:

Avez-vous déjà voulu inclure javascript ou css lors du rendu d'une vue ou d'un bloc particulier? Ou avez-vous déjà voulu inclure javascript ou css uniquement pour la première page sans avoir à écrire de code?

L'ajout de ressources contextuelles vous permet de le faire. Il a une interface utilisateur facile à utiliser pour vous permettre de faire tout cela sans écrire de code. Parce qu'il utilise ctools, tout cela est également exportable.

chrisjlee
la source
2

Écrivez du code JavaScript qui recherche une classe spécifique dans la vue, en utilisant hasClass () de jQuery , et incluez votre fichier JavaScript lorsque la condition est remplie.

Une autre façon consiste à mettre un modèle pour votre vue et à ajouter du code JavaScript via ce modèle à l'aide de drupal_add_js () .

niksmac
la source
Pouvez-vous me dire comment faire cela. En effet, comment inclure des fichiers css et js après qu'une expression conditionnelle dans le script java soit vraie ??!
Mehrdad201
Pour Drupal 8, cette réponse explique comment créer un modèle de vue personnalisé pour la sortie de la vue: stackoverflow.com/a/43131240/227926
therobyouknow