Bagaimana cara menambahkan spesifik JavaScript untuk tampilan?

26

Saya memiliki pandangan di situs saya yang memiliki nama kelas tertentu. Saya ingin tahu, di dalam file template.php dari sebuah tema, bagaimana saya bisa tahu jika tampilan dengan nama kelas tertentu tersedia di halaman yang diminta.

Ini sangat penting bagi saya karena saya perlu memasukkan JavaScript dan CSS tertentu, ketika tampilan dengan nama kelas tertentu (seperti galeri-gambar) digunakan dalam sebuah halaman.

Mehrdad201
sumber

Jawaban:

40

Anda bisa menggunakan template_preprocess_views_view()pengait untuk melakukan ini:

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

Perhatikan bahwa Anda juga dapat memeriksa tampilan tampilan tertentu menggunakan:

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

Anda harus dapat memeriksa kelas css khusus seperti ini:

if ($view->name == 'your-view-name' && $view->display[$view->current_display]->display_options['css_class'] == 'your-css-class') {
   // include javascript & css here
}
Cyclonecode
sumber
Terima kasih banyak, tetapi fungsi ini mengenali tampilan berdasarkan nama, saya ingin mengenali nama kelas, karena Ada beberapa tampilan dalam satu halaman yang memiliki nama kelas yang sama. misalnya 2 tampilan memiliki nama kelas 'galeri-gambar' & 3 tampilan memiliki nama kelas 'kotak-cahaya'. Saya ingin menambahkan js misalnya jika tampilan dengan nama kelas css 'light-box' tersedia di halaman.
Mehrdad201
Tidak bisakah Anda memeriksa layar? if($view->name == 'your-view-name' && $view->display_id == 'your-display-id')
Cyclonecode
tidak, karena tidak jelas berapa banyak tampilan yang tersedia di halaman. mungkin ada 10 tampilan yang semuanya memiliki nama kelas css yang sama.
Mehrdad201
Saya menerapkan hook ini dan mem-flush semua cache - tetapi tidak dipanggil. Tidak yakin kenapa. Ya saya periksa ulang namanya.
jdhildeb
Itu tampak sangat aneh? Anda telah mengganti TEMA dengan nama tema aktual Anda? Ini akan berfungsi dengan baik selama Anda menerapkannya dengan benar.
Cyclonecode
8

Anda dapat menggunakan fungsi views_get_page_view untuk mengetahui tampilan mana yang dilayani pada halaman. Ini mengembalikan objek pandangan. Perhatikan bahwa dalam cuplikan kode di bawah ini Anda harus membandingkan dengan nama mesin yang dapat dibaca, tetapi tentu saja Anda dapat menulis perbandingan berdasarkan pada objek tampilan yang dikembalikan oleh 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
sumber
6

Untuk berjaga-jaga jika ini berguna bagi siapa pun yang menemukan pertanyaan ini, mencari seperti yang saya lakukan untuk melampirkan JavaScript ke Drupal View . Dalam hal D7 & Views 3.7, berikut ini yang paling cocok untuk saya:

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

Ini bermanfaat karena saya ingin menyimpan kode dalam modul saya, bukan temanya - karena perangkat tambahan yang dibawa oleh JavaScript tidak ada hubungannya dengan penampilan visual.

CATATAN: Jelas HOOKharus diganti dengan nama modul Anda, di kedua lokasi, dan CLASS GOES HEREjuga harus diganti dengan kelas yang Anda cari.

Pebbl
sumber
Untuk kejelasan, mengapa pre_render lebih baik daripada pre_process?
Nick
@Nick ~ Tidak ada HOOK_views_pre_process( api.drupal.org/api/views/views.api.php/7 ) kecuali Anda maksud alasan mengapa menggunakan ini THEME_preprocess_views_view- dalam hal ini hanya karena preferensi di mana Anda ingin menambahkan modifikasi kode Anda. HOOK_views_pre_renderdapat dihubungkan ke dalam modul, sedangkan THEME_preprocess_views_viewharus masuk dalam file tema / template Anda. Anda juga bisa menggunakan HOOK_views_post_renderjika Anda mau.
Pebbl
Maaf, maksud saya THEME_preprocess_views_view, ya ... Saya yakin saya sudah melakukannya hook_preprocess_views_viewdi modul sebelumnya.
Nick
4

Jika Anda menggunakan drupal 6 atau 7, Anda juga dapat memasukkan aset javascript dengan konteks modul, menambah aset. Yang memang membutuhkan konteks tetapi Anda akan memastikan bahwa itu akan selalu disertakan ketika tampilan sedang dibuat.

https://drupal.org/project/context_addassets

Dari halaman proyek modul:

Pernahkah Anda ingin memasukkan javascript atau css ketika tampilan atau blok tertentu sedang dibuat? Atau pernahkah Anda ingin memasukkan javascript atau css hanya untuk halaman depan tanpa harus menulis kode?

Menambahkan aset konteks memungkinkan Anda untuk melakukan ini. Ini memiliki UI yang mudah digunakan untuk memungkinkan Anda melakukan ini semua tanpa menulis kode apa pun. Karena menggunakan ctools, semua ini juga dapat diekspor.

chrisjlee
sumber
2

Tulis kode JavaScript yang mencari kelas tertentu dalam tampilan, menggunakan hasClass jQuery () , dan sertakan file JavaScript Anda ketika kondisinya terpenuhi.

Cara lain adalah dengan meletakkan template untuk tampilan Anda, dan menambahkan kode JavaScript melalui template tersebut menggunakan drupal_add_js () .

niksmac
sumber
Bisakah Anda memberi tahu saya, bagaimana saya bisa melakukan ini. Memang bagaimana bisa menyertakan file css dan js setelah ekspresi kondisional dalam skrip java benar ??!
Mehrdad201
Untuk Drupal 8, jawaban ini menguraikan cara membuat templat tampilan khusus untuk output tampilan untuk melakukan ini: stackoverflow.com/a/43131240/227926
therobyouknow