Connexion S'inscrire

Connectez-vous

Login *
Mot de passe *
Se souvenir de moi

Créer un compte

Les champs marqués d'un astérisque (*) sont requis.
Nom *
Login *
Mot de passe *
Vérification mot de passe *
Email *
Vérification email *
Captcha *

Création d'un composant Joomla (partie 11) Gestion des catégories côté client


Dans cette partie,  nous allons commencer à utiliser les catégories sur le site (côté client). Si vous êtes arrivés directement sur cette page, peut-être que vous aimeriez commencer par le début: Partie 1 | Partie 2 | Partie 3 | Partie 4 | Partie 5 | Partie 6 | Partie 7 | Partie 8 | Partie 9 | Partie 10

1 Modification du modèle de la vue liste

Nous ne sommes plus dans le dossier administrator donc depuis la racine du site Joomla, nous allons dans components/com_djguitariste/models. Nous allons ouvrir le fichier de modèle guitaristes.php pour modifier la méthode getListQuery pour qu'elle retourne aussi la catégorie. Comme dans la table des guitaristes nous avons juste l'ID de la catégorie, nous allons faire une jointure avec la table des catégories pour retourner le titre à afficher. Voici le contenu de ce fichier avec les modifications :


<?php
defined('_JEXEC') or die;

class DJGuitaristeModelGuitaristes extends JModelList
{
  
  public function getListQuery()
  {
    $db = $this->getDbo();
    $query = $db->getQuery(true);
    $query->select('a.id, a.name, a.state, a.publish_up, a.publish_down');
    $query->from($db->quoteName('#__djguitariste_items').' AS a');
    
    $query->select('c.title AS category');
    $query->join('LEFT', $db->quoteName('#__categories').' AS c ON c.id = a.catid');
    $query->where('a.state = 1');
    
    return $query;
  }
  
}

Notons que cette méthode est presque identique à la version dans le dossier administrator sauf qu'ici elle ne retourne que les éléments qui sont publié grâce à la ligne: $query->where('a.state = 1') ;.

Nous allons maintenant ouvrir la vue liste pour afficher la catégorie. Le fichier à modifier est default.php et se trouve dans views/guitaristes/tmpl/. On va ajouter le bout de code suivant juste après la fermeture de la balise "a" qui contient le nom du guitariste :


<span class="small"> - (<?php echo $guitariste->category; ?>)</span>

Maintenant le contenu du fichier default.php ressemble à ceci :


<?php
defined('_JEXEC') or die;
?>
<div class="item-page guitaristes">
<?php
  if(empty($this->guitaristes)) { ?>
    <p><?php echo JText::_('COM_DJGUITARISTE_NO_GUITARISTES_FOUND'); ?></p>  
  <?php  
  }
  else {
    foreach($this->guitaristes as $i=>$guitariste){?>
      <p>
        <a href="/<?php echo JRoute::_("index.php?option=com_djguitariste&view=guitariste&id=".$guitariste->id); ?>">
          <?php echo $guitariste->name; ?>
        </a> <span class="small"> - (<?php echo $guitariste->category; ?>)</span>
      </p>
    <?php  
    }
  }
?>
</div>

Si vous visualisez la page liste des guitaristes (côté client), vous devez voir les catégories affichées entre parenthèses juste à côté des noms.

2 Création de la vue catégorie.

Nous allons mettre en place une nouvelle vue nommée categorie pour permettre de créer un lien dans le menu pointant directement sur la liste de guitaristes appartenant à une même catégorie (jazz, blues,...). Dans le dossier views, nous allons créer un nouveau dossier nommé categorie. Pour nous faciliter la tâche, nous allons copier tout le contenu du dossier de vue guitaristes  et coller dans le dossier categorie et ensuite procéder aux modifications suivante.

Premièrement, nous allons modifier le fichier default.xml pour permettre de différencier les vues lors de la création d'un élément de menu. Ce fichier se trouve dans categorie/tmpl/. Nous allons commencer par renommer le titre du layout et ensuite nous allons rajouter un champ de formulaire permettant de choisir la catégorie lors de la création d'un lien dans le menu. Le contenu du fichier default.xml devrait ressembler à ceci :


<?xml version="1.0" encoding="utf-8"?>
<metadata>
  <layout title="COM_DJGUITARISTE_VIEW_CATEGORIE_TITLE">
    <message>
      <![CDATA[COM_DJGUITARISTE_VIEW_CATEGORIE_DESC]]>
    </message>
  </layout>
  <!-- la sélection de la catégorie -->
  <fields name="request">
    <fieldset name="request">
      <field name="id" 
        type="category"
        default="0"
        extension="com_djguitariste"
        label="COM_DJGUITARISTE_FIELD_SELECT_CATEGORY_LABEL"
        description="COM_DJGUITARISTE_FIELD_SELECT_CATEGORY_DESC"
        required="true" />
    </fieldset>
  </fields>
</metadata>

Notons que nous avons ajouter la propriété required="true" pour obliger l'administrateur à sélectionner une catégorie. Nous ne voulons pas arriver sur cette page sans avoir une catégorie à afficher. 

Maintenant nous allons ouvrir le fichier view.html.php qui se trouve dans views/categorie/ pour renommer le nom de la classe DJGuitaristeViewGuitaristes en DJGuitaristeViewCategorie. Le contenu devrait maintenant ressembler à ceci :


<?php
defined('_JEXEC') or die;

class DJGuitaristeViewCategorie extends JViewLegacy
{
  public function display($tpl = null)
  {
    $guitaristes = $this->get('Items');
    $this->guitaristes = &$guitaristes;
    
    parent::display($tpl);   
  }
}

 

Maintenant nous allons avons besoin d'un fichier modèle categorie.php qui se chargera de retourner les guitaristes de la catégorie sélectionnée lors de la création du lien de menu. Nous allons créer dans le dossier models un fichier nommé categorie.php. Pour nous faciliter la tâche, nous allons copier le contenu du fichier guitaristes.php et le coller dans categorie.php. Ouvrons categorie.php pour y apporter les modifications nécessaire. Le nom de la classe DJGuitaristeModelGuitaristes devient DJGuitaristeModelCategorie. et nous allons aussi faire des modifications dans la méthode getListQuery pour récupérer la catégorie et ne sélectionner que les guitaristes de cette catégorie. Le contenu du modèle categorie.php devrait ressembler à ceci :


<?php
defined('_JEXEC') or die;

class DJGuitaristeModelCategorie extends JModelList
{
  
  public function getListQuery()
  {
    
    $app = JFactory::getApplication();
    $id = $app->input->getInt('id', 0);
    
    $db = $this->getDbo();
    $query = $db->getQuery(true);
    $query->select('a.id, a.name, a.state, a.publish_up, a.publish_down');
    $query->from($db->quoteName('#__djguitariste_items').' AS a');
    
    $query->select('c.title AS category');
    $query->join('LEFT', $db->quoteName('#__categories').' AS c ON c.id = a.catid');
    $query->where('a.catid = '.(int)$id);
    $query->where('a.state = 1');
    
    return $query;
  }
  
}

Avant de créer un élément de menu pour notre page catégorie, nous devons rajouter de nouveaux élément dans le fichier de langue (ces éléments viennent du fichier default.xml qui se trouve dans le dossier tmpl de notre vue categorie). Voici le chemin du fichier de langue à ouvrir administrator/language/fr-FR/fr-FR.com_djguitariste.fr-FR.sys.ini (Rappelons nous que c'est le fichier .sys.ini qui est utiliser lors de la création d'un élément de menu). Rajoutons les lignes suivantes :


COM_DJGUITARISTE_VIEW_CATEGORIE_TITLE="Catégorie"
COM_DJGUITARISTE_VIEW_CATEGORIE_DESC="Page liste de guitaristes d'une même catégorie"
COM_DJGUITARISTE_FIELD_SELECT_CATEGORY_LABEL="Catégorie"
COM_DJGUITARISTE_FIELD_SELECT_CATEGORY_DESC="Sélectionnez une catégorie"

Maintenant, nous pouvons nous connecter dans l'administration de notre site et rajouter un élément au Menu Principal ou un menu de votre choix. Cliquez sur sélection devant "le type de lien de menu" Cliquez sur Guitaristes et sur Catégorie. Sélectionnez la catégorie et sauvegarder.

Si vous allez sur le site (côté client), vous allez voir un nouveau lien "Les Jazzmen" dans le menu  et si vous cliquez dessus, vous verrez seulement la liste des guitaristes de la catégorie sélectionnée.

3 Création de la vue liste de catégories

Vous l'avez sûrement deviné, nous allons mettre en place une vue qui va lister toutes les catégories de guitaristes et l'utilisateur pourra cliquer sur la catégorie de son choix pour voir les guitaristes de cette catégorie. Nous allons créer un nouveau dossier nommé categories dans le dossier views. Copiez tout le contenu du dossier guitaristes dans categories. Et nous allons procéder aux modifications exactement comme nous l'avons fait pour le dossier de vue categorie. Nous allons dans categories/tmpl/default.xml pour y modifier le nom du layout :


<?xml version="1.0" encoding="utf-8"?>
<metadata>
  <layout title="COM_DJGUITARISTE_VIEW_CATEGORIES_TITLE">
    <message>
      <![CDATA[COM_DJGUITARISTE_VIEW_CATEGORIES_DESC]]>
    </message>
  </layout>
</metadata>

Nous allons modifier le nom de la classe du fichier view.html.php qui est dans le dossier categories en DJGuitaristeViewCategories. Le contenu de ce fichier devrait ressembler à ceci :


<?php
defined('_JEXEC') or die;

class DJGuitaristeViewCategories extends JViewLegacy
{
  public function display($tpl = null)
  {
    $items = $this->get('Items');
    $this->items = &$items;
    
    parent::display($tpl);
    
  }
}

Nous allons maintenant ouvrir le layout view/categories/tmpl/default.php et faire la liste des catégories en mettant un lien sur chacune des catégories vers la vue categorie en passant l'ID de la catégorie en paramètre dans l'url. Le contenu peut ressembler à ceci :


<?php
defined('_JEXEC') or die;

?>
<div class="item-page djguitariste-categories">
<?php
  if(empty($this->items)) { ?>
    <p><?php echo JText::_('COM_DJGUITARISTE_NO_CATEGORIES_FOUND'); ?></p>  
  <?php  
  }
  else {
    ?>      
    <table class="table table-striped" id="categoriesList">
      <thead>
        <tr>
          <th width="1%" class="nowrap center">
            <?php echo JText::_('COM_DJGUITARISTE_CATEGORIES'); ?>
          </th>
        </tr>
      </thead>
      <tbody>
      <?php foreach($this->items as $i=>$item){ ?>
        <tr>
          <td>
            <a href="/<?php echo JRoute::_("index.php?option=com_djguitariste&view=categorie&id=".$item->id); ?>">
              <?php echo $this->escape($item->title); ?>
            </a>  
          </td>
        </tr>
        <?php } ?>
      </tbody>
    </table>
    <?php  
  }
?>
</div>

Comme vous pouvez le deviner, il nous reste à créer un fichier de modèle pour la vue categories. Dans le dossier models, nous allons créer un fichier nommé categories.php. Copiez le contenu du fichier guitaristes.php et collez dans le fichier categories.php. Nous allons renommé le nom de la classe en DJGuitaristeModelCategories et modifier la méthode getListQuery pour retourner la liste des catégories. Le contenu final du fichier devrait ressembler à ceci :


<?php
defined('_JEXEC') or die;

class DJGuitaristeModelCategories extends JModelList
{
  
  public function getListQuery()
  {
    $db = $this->getDbo();
    $query = $db->getQuery(true);
    $query->select('id, title');
    $query->from($db->quoteName('#__categories'));
    $query->where('extension = "com_djguitariste"')
          ->where('published = 1')
          ->where('access = 1');
        
    return $query;
  }
  
}

Nous allons ajouter les nouveaux clés que nous avons ajouté dans le layout default.php dans notre fichier de langue (côté client). Le chemin du fichier de langue est language/fr-FR/fr-FR.com_djguitariste.ini. Ajouter les lignes suivantes dans ce fichier :


COM_DJGUITARISTE_CATEGORIES="Catégories"
COM_DJGUITARISTE_NO_CATEGORIES_FOUND="Aucune catégorie n'a été trouvé dans la base de données."

Nous allons modifier le fichier de langue .sys dans administrator pour le texte le texte à afficher lors de la création d'un élément de menu. Le chemin du fichier est administrator/language/fr-FR/fr-FR.com_djguitariste.sys.ini. Ajouter les lignes suivantes dans ce fichier :


COM_DJGUITARISTE_VIEW_CATEGORIES_TITLE="Catégories"
COM_DJGUITARISTE_VIEW_CATEGORIES_DESC="Page liste de toutes les catégories"

Rajoutez un élément dans le menu et sélectionnez Catégories comme type de lien de menu en procédant de la même manière que pour la page catégorie pour avoir un lien vers la page liste des catégories. Si vous visualisez la page des catégories, elle devrait ressembler à l'image suivante:

 

Cliquez ici pour lire la suite


  • Dernière modification le jeudi, 28 septembre 2017 15:16
  • 568
Docteur Joomla

Après plus de 10 ans d'expérience en Joomla, je lance ce Blog pour partager mes connaissances avec les autres développeurs Joomla.