Intereting Posts

Demander plusieurs données de fanpage de Facebook en un seul appel Expression régulière pour numéro de téléphone Ember.js et l'accordéon bootstrap – le "chemin de braquage" de création de la vue Opérateurs Ternary en JavaScript sans "Autre" Formulaire JavaScript, soumettre AVEC un champ appelé submit QWebView ne charge pas le javascript externe? Comment puis-je vérifier si l'URL de l'onglet du navigateur actuel est modifiée? Échapper des chaînes en JavaScript JQuery UI – Erreur: ne peut pas appeler les méthodes sur la boîte de dialogue avant l'initialisation; A tenté d'appeler la méthode 'open' Pourquoi je dois mettre tout le script dans index.html dans jquery mobile JQuery appuyez sur la touche de navigation gauche / droite Silverlight hébergé dans Winforms AngularJS: Comment modifier la propriété de couleur via une bascule lorsque la classe css change? Pourquoi passons-nous null à XMLHttpRequest.send? AngularJS – lie ng-model à une variable dont le nom est stocké dans une autre variable

Comment passer une variable de modèle php à javascript

J'ai une page où je souhaite afficher certains points sur la carte. J'ai des petits modèles (comme Smarty, mais plus léger) et là, dans le modèle, j'ai des points $ variables, qui se composent des coordonnées des points dont j'ai besoin. Je dois les transmettre à javascript (car seuls javascript peut rendre cette carte avec des points).

J'ai 3 variantes de le faire. Pouvez-vous dire, ce qui est le mieux?

1ère manière: (Modèle insérant javascript-tags avec variable globale)

Fichier tpl.php:

<script> MAP_POINTS = <?php echo json_encode($this->points); ?>; </script>

Fichier .js

 function renderMap(){ var points = MAP_POINTS; // using global. Is it really bad? or who cares? =)) }

2ème manière: (Passage de la variable via l'élément HTML)

Tpl.php.file

 <input type="hidden" value="<?php echo json_encode($this->points); ?>" id="map_points_container">

Fichier .js

 function renderMap(){ // without globals, but needed to be parsed on local side var points = $.parseJSON ( $( "#map_points_container" ).val() ); }

3ème voie: (AJAX-way)

Je ne passe pas $this->points du fichier modèle du tout. J'ai un autre fichier .php qui gère toutes mes demandes AJAX:

Ajaxing.php

 function get_map_points($params){ // some operations return json_encode ($map_points); }

Et que du côté local, j'aurai quelque chose comme ça:

Fichier .js

 $.post ( 'ajaxing.php', params, function(points){ renderMap(points); }, 'json');

La troisième façon est habituelle, mais si je passe déjà des valeurs du modèle à la page locale, je peux passer et mapper les points aussi. En fait, je n'ai pas besoin de faire une autre demande pour ces points de carte (c'est pourquoi je n'aime pas la troisième voie)

Mais peut-être que vous pouvez me conseiller d'une autre manière? Une meilleure façon?

Comme je l'ai choisi:

1ère façon avec peu de remarques. Tout mon code 'map-rendering' se trouve dans un autre fichier et c'est comme:

 $(function(){ MAP_APP = {}; MAP_APP.some_prop = null; // some properties MAP_APP.some_method = function(){}; // some methods });

Donc, dans le fichier modèle, je n'ai qu'à étendre mon objet MAP_APP:

 <script> MAP_APP.points = <?php echo json_encode($this->points); ?>; </script>

Oui, variable globale. Mais c'est comme un espace de noms de toute l'application.

Merci à tout le monde.

La première façon est certainement la moins compliquée et la plus rapide.

Le second ajoute une étape de traitement supplémentaire (l' parseJSON() ) qui n'est pas nécessaire.

La troisième façon est bonne si vous rencontrez beaucoup de données facultatives (c'est-à-dire ne nécessite que si l'utilisateur le demande, et il n'est pas sûr de savoir si cela se produira) ou dynamique. Cela crée une nouvelle demande et ne sera pas immédiatement disponible.

Si vous ne souhaitez pas utiliser des globals, vous pouvez, par exemple, envelopper vos fonctions JavaScript dans un objet et remplir une propriété d'objet à partir de PHP:

 <script> MyObject.MAP_POINTS = <?php echo json_encode($this->points); ?>; </script>

Il existe une autre manière funky de passer des variables dans un fichier externe js 🙂

Votre fichier PHP:

 <script type='text/javascript' src='script.js?id=0&some=<?php echo $whatever?>'></script>

Et à l'intérieur de votre script.js vous pouvez récupérer ces valeurs:

 var scripts = document.getElementsByTagName('scripts'); // get your current script; for (var i=0,l=scripts.length;i<l;i++){ if(scripts[i].src.indexOf('script.js') !== -1) { // or your script name var query = scripts[i].src.substr(scripts[i].src.indexOf('?')+1); // now you can split the query and access the values you want .... } }

Le premier est le plus efficace et le plus rapide. La seconde est géniale. Le troisième est également bien.

Le premier parce qu'il ne nécessite aucune autre demande. Le second est un peu bizarre, je n'utiliserais pas ce genre de constructions, mais cela ne signifie pas que vous ne pouvez pas. Le troisième est également bien, mais vous devriez penser si AJAX est le chemin à parcourir. Si votre demande nécessite plusieurs demandes de points pour différents emplacements, il pourrait être le moyen le plus efficace.

J'irais avec votre deuxième méthode car vous ne souhaitez pas utiliser AJAX pour cela (et il semble étrange d'utiliser AJAX pour quelque chose que vous avez déjà dans la page actuelle). Vous souhaitez limiter le nombre de variables globales dans votre JavaScript, car tout dans votre JavaScript créera une instance de chaque variable globale et diminuera ainsi vos performances.

J'ai oublié le nom de la personne, mais l'homme qui se dirigeait sur l'optimisation sur Yahoo! Et ensuite travaillé pour Google a donné une conférence sur l'optimisation de JavaScript, et c'était l'un de ses points.

EDIT: trouvé le lien: http://sites.google.com/site/io/even-faster-web-sites

Vitesse sage, la première voie est la meilleure façon.

Mais la meilleure façon est de créer une sortie XML de PHP et de charger ce xml dans Javascript via Ajax. Le meilleur exemple de cet article est donné sur la documentation Google Maps – http://code.google.com/apis/maps/articles/phpsqlajax_v3.html

Autrement:

Dans script_that_defines_renderMap.js :

 function renderMap(points) { // take "points" as an argument }

Et alors:

 <script src="script_that_defines_renderMap.js"/> <script> var mapPoints = <?php echo json_encode($this->points); ?>; renderMap(mapPoints); </script>

Pas de variable globale, pas de problème.