Wie sende ich eine Variable von einer .php-Datei in eine .js-Datei?

37

Ich hoffe jemand kann mir helfen. Das Problem ist das folgende: 1) Ich habe ein Modul, in dem eine Variable zugewiesen wird, um sie an die Vorlagendatei php.tpl zu senden

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

Diese Variable kann wie in der php.tpl Datei angezeigt werden

<?php print $testvar?>

2) Ich habe die .js-Datei getrennt. Wie kann ich auf diese Variable in der .js-Datei zugreifen?

Ich weiß, wie es sein wird, wenn sich die .js-Datei in .php.tpl befindet:

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

Das Problem ist, wie man dasselbe macht, wenn diese beiden Dateien .js und .php.tpl getrennt sind.

Alexey
quelle
2
Gib eine Variable nicht blindlings in Javascript aus. Wenn Javascript-Metazeichen (insbesondere einfache Anführungszeichen) vorhanden sind, treten Syntaxfehler auf. Tun Sie var myVar = <?php echo json_encode($testvar) ?>;dies, um solche Probleme für Sie zu lösen, unabhängig vom Datentyp / Inhalt der PHP-Variablen.
Liste der Tipps und Tricks zu Drupal 7 js browse-tutorials.com/tutorial/javascript-drupal-7
ram4nd

Antworten:

65

Sie sollten drupal_add_js()in Ihrem Modul verwenden, es besteht keine Notwendigkeit, die Variable in Ihrem auszugeben .tpl.php:

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

Und in Ihrem JavaScript können Sie auf den Wert zugreifen in Drupal.settings.YOURMODULE.testvar:

alert(Drupal.settings.YOURMODULE.testvar);

Die direkte Verwendung globaler Variablen (wie in Ihrem Codebeispiel vorgeschlagen) wird in JavaScript nicht empfohlen, da sie den globalen Namespace überladen . Wenn Ihr Code beim Laden einer Seite ausgelöst wird, lesen Sie den Abschnitt "Verhalten" in der Dokumentation zum Verwalten von JavaScript in Drupal 7 (die gesamte Seite ist lesenswert).

Pierre Buyle
quelle
17

Verwenden Sie in Ihrer Datei MODULENAME.module den folgenden Code.

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

Und in MODULENAME.js verwenden Sie den folgenden.

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

})(jQuery);

Auf diese Weise können Sie Ihre PHP-Variable an JavaScript übergeben und verwenden.

Himanshu Pathak
quelle
Was macht die Funktion und wann wird sie ausgelöst? Warum nicht direkt Drupal.settings.YOURMODULE.testvar verwenden?
Unglaublicher
5

Für Drupal 8 wurde drupal_add_js()es entfernt (in Drupal 7 war es bereits veraltet) => Weitere Informationen finden Sie hier .

Die Möglichkeit, PHP-Informationen an Javascript zu senden, wird durch die Antwort von @ 4k4 auf eine ähnliche Frage perfekt beschrieben .

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,  // <== 
      ],
    ],
  ],
];

In JavaScript können sie wie folgt verwendet werden:

(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
quelle
Erwähnenswert ist, dass im *.libraries.ymldort auch eine Abhängigkeit definiert werden soll - core/drupalSettings.
Leymannx