Une introduction aux vues et aux modèles dans CodeIgniter

Les vues sont un élément clé de toute application MVC, et les applications CodeIgniter ne sont pas différentes. Aujourd'hui, nous allons apprendre ce qu'est une vue et découvrir comment elle peut être utilisée pour créer une solution de modèle pour vos projets CodeIgniter..

La première partie de ce didacticiel explique aux débutants complets de CodeIgniter ce qu’est une vue et comment l’utiliser dans une application typique. La seconde moitié discutera des motivations pour trouver une solution de templates et guidera le lecteur à travers les étapes nécessaires à la création d'une bibliothèque de templates simple mais efficace.. 

Si vous voulez faire plus avec CodeIgniter, consultez la gamme de plug-ins CodeIgniter et de scripts de code sur Envato Market..

Plugins CodeIgniter et scripts de code sur Envato Market

Qu'est-ce qu'une vue?

Les vues sont des fichiers spéciaux utilisés dans CodeIgniter pour stocker le balisage généré par l'application, généralement composés de balises HTML et PHP simples..

«Une vue est simplement une page Web ou un fragment de page, comme un en-tête, un pied de page, une barre latérale, etc. En fait, les vues peuvent être intégrées de manière flexible dans d'autres vues (dans d'autres vues, etc.) si vous en avez besoin. type de hiérarchie. "

Les vues sont chargées depuis les méthodes du contrôleur, le contenu de la vue étant ensuite affiché dans le navigateur..


Comment charger une vue

Pour charger (et afficher) une vue dans CodeIgniter, nous utilisons la bibliothèque intégrée Loader.

$ this-> load-> view ('hello_world', $ data, true / false);

Cette seule ligne de code indiquera à CodeIgniter de rechercher hello_world.php dans le application / vues dossier et afficher le contenu du fichier dans le navigateur.

Remarque que CodeIgniter vous permet d’exclure le suffixe .php, en enregistrant quelques frappes de touche lors de la saisie du nom de fichier de la vue que vous souhaitez charger.

Le second paramètre, $ data, est optionnel et prend un tableau ou un objet associatif. Ce tableau / objet est utilisé pour transmettre des données au fichier de vue afin qu'il puisse être utilisé ou référencé dans la vue..

Le final optionnel Ce paramètre détermine si le contenu de la vue est affiché dans la fenêtre du navigateur ou renvoyé sous forme de chaîne. La valeur par défaut de ce paramètre est False, ce qui affiche le contenu dans le navigateur. Nous verrons plus loin dans le tutoriel comment ce paramètre peut être utilisé lors de la création d'une solution de template.


Créer et afficher une vue

Pour configurer notre première vue, créez un nouveau fichier appelé hello_world.php dans application / vues et écrivez le code HTML simple suivant dans:

   Bonjour le monde!   

Bonjour le monde!

Maintenant, pour afficher cette vue dans le navigateur, elle doit être chargée dans une méthode Controller, en utilisant la méthode susmentionnée..

Créons donc un nouveau fichier contrôleur appelé hello_world.php dans application / contrôleurs et placez le code suivant dans. Depuis ce contrôleur, nous allons charger la vue nouvellement créée.

load-> view ('hello_world'); 

Pointant votre navigateur sur http://votre-ci-install.com/index.php/ entraînera maintenant le code HTML application / views / hello_world.php en cours de sortie dans le navigateur. Vous avez chargé avec succès une vue!

Chargement de plusieurs vues

Le fractionnement d'une vue en plusieurs fichiers facilite la maintenance de votre site Web et réduit les risques de doublons..

Afficher une seule vue est très bien, mais vous pouvez diviser la sortie en plusieurs fichiers distincts, tels que en-tête, contenu et pied de page vues.

Le chargement de plusieurs vues s’effectue simplement en appelant le $ this-> load-> view () méthode plusieurs fois. CodeIgniter ensuite concatène le contenu des vues avant de s'afficher dans le navigateur.

Créez un nouveau fichier appelé header.php dans application / vues et couper / coller les premières lignes de notre original hello_world.php déposer dans.

   Bonjour le monde!  

De même, créez un autre fichier appelé footer.php dans application / vues et déplacez les deux dernières lignes de hello_world.php dans.

 

Cela laisse la hello_world.php voir le fichier contenant uniquement le contenu de notre page.

Bonjour le monde!

Maintenant, pour afficher à nouveau la page, nous devons charger les trois vues (header.php, hello_world.php, footer.php), dans l’ordre, dans notre contrôleur..

Rouvrir application / controllers / hello_world.php et ajoutez le nouveau $ this-> load-> view () appels au-dessus et au-dessous de celui existant.

load-> view ('en-tête'); $ this-> load-> view ('hello_world'); $ this-> load-> view ('footer'); 

Parce que les vues d’en-tête et de pied de page sont maintenant séparées de la Bonjour le monde affichage, cela signifie qu'ils peuvent être utilisés conjointement avec tout autre affichage du site Web. Cela signifie que le code des fichiers d'en-tête et de pied de page n'a pas besoin d'être copié dans une autre vue du projet nécessitant ce code..

Évidemment, c’est un avantage énorme, car toute modification apportée au HTML ou au contenu des vues, par exemple l’ajout d’une nouvelle feuille de style à l’en-tête, ne peut être appliquée qu’à un seul fichier, et non à chaque fichier.!


Utilisation des données du contrôleur dans la vue

Nous allons maintenant examiner les données transmises par les contrôleurs afin qu’elles puissent être utilisées ou sorties dans la vue..

Pour cela, nous allons passer un tableau associatif, $ data comme second paramètre de la $ this-> load-> view () appel.

le valeurs de ce tableau seront accessibles dans la vue chargée en tant que variables, nommées par leurs noms respectifs. clés.

$ data = array ('title' => 'Hello World!', 'content' => 'Ceci est le contenu', 'posts' => array ('Post 1', 'Post 2', 'Post 3') ) $ this-> load-> view ('hello_world', $ data);

Le code ci-dessus donnera la variable $ title la valeur 'Hello World!' à l'intérieur de Bonjour le monde vue.

Comment utiliser les variables dans les vues

Une fois que nous avons transmis nos données aux fichiers de vue, les variables peuvent être utilisées de la manière habituelle..

En règle générale, le fichier de vue utilisera les données transmises pour:

  • Afficher la valeur d'une variable
  • Boucle à travers des tableaux ou des propriétés d'objet
  • Utiliser des instructions conditionnelles pour afficher ou masquer les balises

Je vais passer en revue des exemples rapides sur la façon de faire chaque.

Pour afficher le contenu d'une variable, utilisez l'instruction echo simple et familière:

 

La boucle dans un tableau, ou un objet, est une tâche courante dans les fichiers de vue et peut être réalisée avec une boucle foreach:

Des instructions conditionnelles simples peuvent être utilisées dans les fichiers de vue pour modifier légèrement la sortie, en fonction des données transmises.

En règle générale, vous souhaitez limiter l'utilisation des instructions conditionnelles dans les vues, car une utilisation excessive peut conduire à des fichiers de vues complexes contenant une «logique métier». Fractionner la vue en différents fichiers et décider lequel afficher dans le contrôleur est beaucoup plus préférable.

 

Veuillez vous connecter

L'exemple ci-dessus affichera soit un message "Bienvenue", soit une demande de connexion de l'utilisateur, en fonction de la valeur de $ connecté (vrai faux).


Templating dans CodeIgniter

Nous avons vu comment le fractionnement des vues en fichiers séparés plus petits peut aider à organiser et à réduire le nombre de fichiers dans vos projets CodeIgniter. Toutefois, plusieurs appels de vue de chargement doivent être effectués chaque fois qu'une page est affichée..

Supposons que vous ayez des vues d'en-tête et de pied de page distinctes, utilisées pour former un modèle. Dans chaque instance du projet où vous souhaitez charger et afficher une page à l'aide de ce modèle, trois charges de vue doivent être appelées. Non seulement cela peut encombrer vos contrôleurs, mais il en résulte beaucoup de code répété - c'est exactement ce dont nous voulions nous débarrasser en séparant les fichiers..

Si vous souhaitez ajouter maintenant des balises supplémentaires à ce modèle, par exemple un menu dans la barre latérale. Cela pourrait aller dans la vue d'en-tête, mais il est plus approprié d'être dans sa propre vue séparée. Ajouter cette nouvelle vue au modèle existant implique de passer en revue chaque instance des chargements de vue et d’en ajouter une autre. Cela peut être compliqué rapidement..

Nous avons besoin d'un moyen d'incorporer des fichiers d'affichage affichant le contenu de chaque page, dans un modèle, sans répéter le code, et d'un système permettant de modifier facilement et efficacement le modèle..

Les étapes suivantes vous guideront dans la création d'une bibliothèque CodeIgniter simple qui répond à ces besoins, ainsi que:

  • Mise en place d'une structure de répertoires prévisible et maintenable pour vos vues
  • Permettant d'utiliser plusieurs modèles distincts
  • Réduire le chargement d'une page en une seule ligne de code

Une fois que la bibliothèque est écrite et dans notre ceinture CodeIgniter, nous pourrons afficher une page modèle comme ceci:

$ this-> template-> load ('template_name', 'body_view');

Beaucoup mieux!

Notre solution de modèles utilisera des fichiers de vue contenant le balisage complet d'un modèle, avec un espace réservé pour un autre fichier de vue (avec le contenu de la page) à incorporer dans.

L'espace réservé sera en réalité juste une variable nommée $ body. Lors du chargement d’une vue basée sur un modèle avec notre bibliothèque, le contenu du fichier de vue du corps approprié sera attribué à cette $ body, incorporer la vue dans le modèle.


Étape 1: Configuration du répertoire

Nous voulons imposer un système de répertoires raisonnable et prévisible pour que nos fichiers de vue soient hébergés, afin que nos vues soient:

  • Facile à localiser
  • Facile de déterminer à quel domaine de l'application ils appartiennent
  • Facile à maintenir

Notre système de répertoires permettra également à la bibliothèque de déterminer intelligemment où chercher les fichiers de vues, réduisant ainsi la quantité de code nécessaire pour charger une vue basée sur un modèle.

Créer un nouveau dossier dans le application / vues répertoire et nommez-le des modèles. Ce dossier contiendra les différentes vues de modèle.


Étape 2: Création de la bibliothèque

Les bibliothèques dans CodeIgniter ne sont que des classes PHP et sont chargées dans les contrôleurs un peu comme les vues.

$ this-> load-> library ('nom_classe');

Les bibliothèques personnalisées que vous utilisez dans vos projets CodeIgniter sont stockées dans la application / bibliothèques dossier. Pour commencer à écrire notre bibliothèque de modèles, créez un nouveau fichier dans ce dossier appelé Template.php, et placez le code suivant dans:

ci = & get_instance (); 

Le code ci-dessus définit une nouvelle classe ou bibliothèque nommée Modèle et le __construction() méthode à l'intérieur.

Cette méthode affecte le super objet CodeIgniter à la $ ci variable de classe, permettant à toutes les ressources de CodeIgniter d'être utilisées en remplaçant $ this avec $ this-> ci dans la méthode habituelle appelle.

Lorsque la bibliothèque est chargée dans le framework CodeIgniter, le __construction() la méthode est appelée automatiquement.

Écrire la méthode de chargement

Nous allons maintenant écrire la méthode pour charger une vue modèle. Nous voulons transmettre jusqu'à trois paramètres à cette fonction:

  • Le nom du modèle
  • Le nom de la vue du corps (facultatif)
  • Les données à transmettre aux vues (facultatif)

Le résultat de cette méthode appelée sera la vue du modèle affichée dans le navigateur, avec la vue du corps incorporée dans, le cas échéant..

Sous le __construction() méthode, placez le code suivant:

charge de la fonction ($ tpl_view, $ body_view = null, $ data = null) if (! is_null ($ body_view)) if (file_exists (APPPATH.'views /'.$ tpl_view. '/'. $ body_view))  $ body_view_path = $ tpl_view. '/'. $ body_view;  else if (file_exists (APPPATH.'views / '.$ tpl_view.' / '. $ body_view.'. php ')) $ body_view_path = $ tpl_view.' / '. $ body_view.'. php ';  else if (file_exists (APPPATH.'views /'.$ body_view)) $ body_view_path = $ body_view;  else if (file_exists (APPPATH.'views / '.$ body_view.'. php ')) $ body_view_path = $ body_view.'. php ';  else show_error ('Impossible de charger le fichier demandé:'. $ tpl_name. '/' $ view_name. '. php');  $ body = $ this-> ci-> load-> view ($ body_view_path, $ data, TRUE); if (is_null ($ data)) $ data = array ('body' => $ body);  else if (is_array ($ data)) $ data ['body'] = $ body;  else if (is_object ($ data)) $ data-> body = $ body;  $ this-> ci-> load-> view ('templates /'.$ tpl_view, $ data); 

Le code ci-dessus commence par vérifier si le $ body_view paramètre a été fourni à la méthode. Cette variable contiendra le nom de la vue à utiliser comme corps dans la vue modèle.

 if (! is_null ($ body_view))

Si le paramètre est fourni, une série de vérifications file_exists est effectuée pour essayer de localiser le fichier de vue dans notre système de répertoires..

if (file_exists (APPPATH.'views /'.$ tpl_view. '/'. $ body_view)) $ body_view_path = $ tpl_view. '/'. $ body_view;  else if (file_exists (APPPATH.'views / '.$ tpl_view.' / '. $ body_view.'. php ')) $ body_view_path = $ tpl_view.' / '. $ body_view.'. php '; 

Le code tente d'abord de localiser le fichier de vue à l'intérieur d'un dossier. avec le même nom que le modèle dans le application / vues dossier.

Ceci est utile si les sections de votre projet sont radicalement différentes des autres et utilisent des modèles différents. Dans ces circonstances, il est logique de regrouper ces fichiers de vue.

Par exemple, de nombreux sites Web affichent un modèle différent pour des sections distinctes, telles que les blogs. Dans notre système, les fichiers de vue de blog peuvent être placés dans le application / vues / blog dossier, en les séparant des vues du site principal.

Si le fichier de vue ne peut pas être situé dans ce dossier, .php est ajouté à la fin du nom de fichier et la vérification est effectuée à nouveau. C'est tout simplement .php peut être exclu comme le natif $ this-> load-> view () appel.

Si le fichier ne peut toujours pas être localisé, des vérifications supplémentaires pour son emplacement sont effectuées.

else if (file_exists (APPPATH.'views /'.$ body_view)) $ body_view_path = $ body_view;  else if (file_exists (APPPATH.'views / '.$ body_view.'. php ')) $ body_view_path = $ body_view.'. php ';  else show_error ('Impossible de charger le fichier demandé:'. $ tpl_name. '/' $ view_name. '. php'); 

Cette fois, le code vérifie si le fichier de vue est situé dans la application / vues dossier, et encore une fois, s'il est introuvable, ajoute .php et vérifie encore une fois.

Si le fichier est situé à l’un de ces emplacements, le chemin est attribué à $ body_view_path, sinon, un message d'erreur est émis à l'aide de la touche show_error () fonction intégrée à CodeIgniter, et le script est terminé.

Si le fichier de vue du corps a été localisé avec succès, le contenu est affecté à la $ body variable.

 $ body = $ this-> ci-> load-> view ($ body_view_path, $ data, TRUE);

Nous passons le $ data paramètre (null si non fourni) à l'appel de chargement de la vue et définissez le troisième paramètre sur vrai pour retourner la sortie de la vue sous forme de chaîne.

Nous ajoutons maintenant ceci $ body variable à la liste des données dans $ data afin qu'il puisse être intégré dans la vue du modèle lorsqu'il est chargé.

if (is_null ($ data)) $ data = array ('body' => $ body);  else if (is_array ($ data)) $ data ['body'] = $ body;  else if (is_object ($ data)) $ data-> body = $ body; 

Si $ data n'a pas été fourni à la charge() appel, $ data est assigné à un tableau contenant $ body sous clé corps. Si le paramètre a été fourni, $ body est ajouté à la liste en l'attribuant à une clé de tableau ou à la propriété d'un objet, tous deux également nommés corps.

le $ body variable peut maintenant être utilisée dans les fichiers de vue des modèles en tant que espace réservé pour les vues intégrées.

La dernière ligne de notre méthode charge le fichier de vue des modèles à partir du application / vues / modèles dossier, et passe le $ data variable dans le second paramètre.

 $ this-> ci-> load-> view ('templates /'.$ nom_pli, $ data);

Et c'est tout! La bibliothèque peut maintenant être utilisée.


Utiliser la bibliothèque

Pour commencer à utiliser notre bibliothèque, créons une vue modèle nommée default.php dans application / vues / modèles, et placez le HTML / PHP suivant à l'intérieur:

   <?php echo $title; ?>   

Modèle par défaut

Dans ce modèle, nous référons deux variables, $ title et $ body.

Rappelons-le dans nos fichiers modèles, $ body sert d'espace réservé pour une vue intégrée.

Nous allons maintenant créer une autre vue pour l’intégrer dans ce modèle. Créer un nouveau fichier nommé content.php dans application / vues / et placez ce simple HTML à l'intérieur:

Bonjour le monde!

Nous sommes maintenant prêts à charger la vue de page basée sur un modèle à partir d'un contrôleur..

Dans toute méthode de contrôleur, placez le code suivant pour afficher le contenu vue, dans le défaut modèle.

$ data = array ('title' => 'Le titre va ici',); $ this-> load-> library ('template'); $ this-> template-> load ('default', 'content', $ data);

Remarque: la bibliothèque doit être chargée avant de pouvoir appeler le charge méthode. Pour vous épargner en chargeant la bibliothèque chaque fois qu'une vue modèle doit être affichée,
charger automatiquement la classe en l'ajoutant au tableau des bibliothèques de application / config / autoload.php.

Si, au lieu d’un fichier de vue, vous souhaitez incorporer une chaîne dans le modèle, affectez-la simplement à la chaîne. $ data tableau en utilisant la clé corps, et passe nul comme second paramètre de l'appel de charge.

$ data = array ('title' => 'Le titre va ici', 'body' => 'La chaîne à intégrer ici!'); $ this-> template-> load ('default', null, $ data);

Conseil rapide

J'ai trouvé que le regroupement des fichiers de vue dans les dossiers du contrôleur, et même la méthode à laquelle ils appartiennent, aide vraiment à garder mes vues organisées et faciles à localiser..

En organisant vos vues de cette manière, la structure de répertoires suit de près le schéma d’URL de contrôleur / méthode.

Par exemple, supposons que votre projet ait un contrôleur nommé Membres, méthode contenant liste.

Un endroit approprié pour le liste voir le fichier serait dans application / vues / membres, ou application / vues / membres / liste, si cette méthode charge plusieurs vues.

Cette vue pourrait ensuite être intégrée à un modèle à l'aide de notre bibliothèque avec le code suivant:

$ this-> template-> load ('template_name', 'members / list');

Conclusion

La solution de modélisation présentée dans ce didacticiel est l’une des nombreuses façons de réaliser une modélisation dans CodeIgniter..

Vous devriez maintenant savoir ce que sont les vues et comment les utiliser efficacement dans vos projets CodeIgniter..

La solution de modélisation décrite dans ce didacticiel est l’une des nombreuses façons de réaliser une modélisation dans CodeIgniter. Il existe différentes approches et je vous encourage, lecteurs, à rechercher d'autres méthodes et à choisir celle qui convient le mieux à vos projets..

Si vous avez des commentaires ou des questions sur le didacticiel, ou des idées sur différentes solutions de modèles, veuillez laisser un commentaire ci-dessous! Merci d'avoir lu.