Tag Archives

3 Articles
Aides de vue JQuery

Aides de vue JQuery

Cet article m’a été demandé et donc je le fais, peut-être en retard mais je n’ai pas eu le temps de le faire plus tôt. Il a pour but l’utilisation de code JQuery à travers l’aide de vue associé à cet effet. Je vais utiliser un exemple concret avec l’utilisation du module « thickbox » permettant l’affichage d’images d’un format plus grand dans une nouvelle fenêtre.

Tout d’abord, il faut avoir installé l’extention ZendX_JQuery dans votre projet. Un sujet détaillant l’installation va arriver prochainement. Ensuite, il faut savoir utiliser les aides de vue qui nous intéresse, ici il s’agit des aides suivantes :
//permet d'ajouter des feuilles de script dans la pile de JQuery
$this->jQuery()->addJavascriptFile();
//permet d'ajouter une feuille de style dans la pile de JQuery
$this->jQuery()->addStylesheet();

Ensuite, il nous faut télécharger le module JQuery Thickbox à cette adresse : http://jquery.com/demo/thickbox/ Par contre ce module n’est plus maintenu à jour. Mais il convient parfaitement pour créer une galere d’image. Je ne vais pas revenir sur l’utilisation et la mise en page de ce module. Vous trouverez toutes les aides sur le site. Juste que nous, avec nos aides, nous allons intégrer dynamiquement, pour la page seulement qui nous intéresse, les lignes script et styles concernées dans le header.

Tout en haut de notre script de vue, nous ajoutons les lignes suivantes afin de mettre en place thickbox :
$this->jQuery()->addJavascriptFile($this->BaseUrl().'/scripts/thickbox-compressed.js')
->addStylesheet($this->BaseUrl().'/styles/thickbox.css')
->enable();

La fonction enable() est ici obligatoire sinon le module JQuery ne se chargera pas.

Dans la vue nous avons aussi la mise en forme décrite dans la documentation de thickbox.

Voilà, ici nous voyons l’intérêt de telles fonctions afin d’intégrer de l’ajax directement dans les pages qui nous intéressent afin de ne pas prolonger inutilement le chargement des autres pages.

Vue d’ensemble

Comme vous le savez sûrement, à chaque action est rattachée une vue. Par exemple dans votre contrôleur vous avez l’action fooAction() et la vue foo.phtml.

Là ça deviens plus dur pour un découpage fonctionnel. Effectivement pour votre blog vous voulez afficher sur la même page l’action articleAction() et commentaireAction().

Cette question m’a souvent taraudé l’esprit et en regardant la documentation, je tombai sur cette aide de vue :
$this->action(string action, string controller, string module, array params) ;
Pour simplifier voici une image montrant un plan de découpe d’une page de news:

L’action que l’on appelle dans le lien sera notre action news : http://monsite.com/news/index/index/ A l’intérieur on fait notre mise en page html et aux endroits où on veut qu’apparaisse nos autres actions (ici menu haut et menu bas) il vous suffira de faire par exemple:


Voilà. Cet article est terminé, ici j’ai juste essayer de vous montrer une possibilité offerte par le framework.

Création d’URL valides

Dans l’article d’aujourd’hui je vais vous montrer comment créer une URL valide dans vos vues.

Pourquoi vous l’expliquer ? Et bien car un ami est venu me voir pour ça hier.

D’ailleurs la création d’une url en soit n’est pas très compliquée, voici la syntaxe à utiliser :
$this->url(array('module' => 'nommodule', 'controller' => 'nomcontroller', 'action' => 'nomaction', 'nomparam1' => 'valeurparam1', ...);
Comme on peut voir pour la partie module, controller, action il faut dire d’abord lequel des 3 on veut, puis leur nom. Pour les paramètres c’est différent, on donne le nom du paramètre puis ensuite sa valeur. Vous pouvez voir dans l’url que je suis dans le module blog, le controller index et l’action article. Je passe en paramètre idarticle qui contient l’id de l’article. Si vous modifiez la valeur de cette id, vous aurez un autre article si celui-ci existe.

Pour récupérer vos paramètres dans vos actions, rien de plus simple, vous pouvez utiliser cette méthode :
$this->_request->getParam('nomparam', 'valeurdefaut');
La valeur par défaut est très utile pour éviter des erreurs si vous avez absolument besoin du paramètre.

Voilà, je pense avoir tout dit sur cette partie là et j’espère avoir répondu à vos questions.