jak wysłać zmienną z pliku .php do pliku .js?

37

Mam nadzieję, że ktoś może mi pomóc. Problem jest następujący: 1) Mam moduł, w którym przypisuję zmienną w celu wysłania do pliku szablonu php.tpl

<?php
...
$testvar="Hello from alex!";
$variables['testvar'] = $testvar; 
...
?>

Ta zmienna może być pokazana w pliku php.tpl jak

<?php print $testvar?>

2) Oddzieliłem plik .js Jak mogę uzyskać dostęp do tego zmiennego pliku .js?

Wiem, jak to będzie, jeśli plik .js znajduje się w .php.tpl:

<?php
$testvar="Hello from alex!";
?>
<script type="text/javascript">
var myVar = '<?php print $testvar?>';
</script>

Problem polega na tym, jak to zrobić, jeśli te dwa pliki .js i .php.tpl są rozdzielone?

Alexey
źródło
2
nie wysyłaj na ślepo echa zmiennej do Javascript. Jeśli są jakieś metaznaki JavaScript (zwłaszcza pojedyncze cudzysłowy), wprowadzisz błędy składniowe. Czy var myVar = <?php echo json_encode($testvar) ?>;który zadba o takich kwestiach dla ciebie, niezależnie od typu danych / treści PHP var za.
Lista porad i wskazówek Drupal 7 js browse-tutorials.com/tutorial/javascript-drupal-7
ram4nd

Odpowiedzi:

65

Powinieneś użyć drupal_add_js()w swoim module, nie ma potrzeby wypisywania zmiennej w .tpl.php:

drupal_add_js(array('YOURMODULE' => array('testvar' => $testvar)), array('type' => 'setting'));

I w JavaScripcie, można dostęp wartość w Drupal.settings.YOURMODULE.testvar:

alert(Drupal.settings.YOURMODULE.testvar);

Bezpośrednie użycie zmiennych globalnych (zgodnie z sugestią w przykładzie kodu) jest odradzaną praktyką w JavaScript, ponieważ zaśmieca globalną przestrzeń nazw . Ponadto, jeśli Twój kod jest uruchamiany podczas ładowania strony, sprawdź sekcję „Zachowania” w Zarządzaniu JavaScript w dokumentacji Drupal 7 (cała strona jest warta przeczytania).

Pierre Buyle
źródło
17

W swoim pliku MODULENAME.module użyj następującego kodu.

$testVariable = 'himanshu';
drupal_add_js(array('MODULENAME' => array('testvar' => $testVariable)), array('type' => 'setting'));
drupal_add_js(drupal_get_path('module', 'MODULENAME') . '/MODULENAME.js');

I w MODULENAME.js użyj następującego.

(function($) {
  Drupal.behaviors.MODULENAME = {
    attach: function (context, settings) {
      alert(settings.MODULENAME.testvar);
    }
  };

})(jQuery);

W ten sposób możesz przekazać swoją zmienną PHP do JavaScript i użyć jej.

Himanshu Pathak
źródło
Co robi funkcja i kiedy jest uruchamiana? Dlaczego nie korzystać bezpośrednio z Drupal.settings.YOURMODULE.testvar?
Niesamowite
5

Dla Drupal 8 , drupal_add_js()usunięto (został przestarzałe już w Drupal 7) => zobaczyć dalszych informacji .

Sposób przesyłania informacji PHP do Javascript jest doskonale opisany w odpowiedzi @ 4k4 na podobne pytanie.

return [
  '#theme' => 'item_list',
  '#list_type' => 'ul',
  '#items' => $my_items,
  '#attributes' => ['class' => 'some_class'],
  '#attached' => [
    'library' => ['my_module/my_library'],
    'drupalSettings' => [
      'my_library' => [
        'some_variable1' => $value,        // <== Variables passed
        'another_variable' => $take_this,  // <== 
      ],
    ],
  ],
];

W JavaScript mogą być używane w następujący sposób:

(function ($, Drupal, drupalSettings) {
  Drupal.behaviors.my_library = {
    attach: function (context, settings) {

      alert(drupalSettings.my_library.some_variable); //alerts the value of PHP's $value

    }
  };
})(jQuery, Drupal, drupalSettings);
Florian Müller
źródło
Warto wspomnieć, że w tym *.libraries.ymlnależy również zdefiniować zależność - core/drupalSettings.
leymannx