Bonjour à tous les amis, dans ma page GUIDE : j'ai une liste d'article dans une sidebar que j'affiche dans un main-content avec l'aide de JS, cela fonctionne bien. Mais dans ma page HOME j'ai mis en place une boucle d'afficher juste le nom du dernier article mais je n'arrive pas à faire le chemin à afin qu'il accede directement a ma page article... J'ai tenté plusieurs trucs mais ça n'affiche pas l'article en question à travers ma page guide, auriez-vous une idée ? svp merci d'avance

Voici mon HomeController :

<?php

namespace App\Controller;

use App\Entity\Article;
use Doctrine\ORM\EntityManagerInterface;
use Symfony\Bundle\FrameworkBundle\Controller\AbstractController;
use Symfony\Component\HttpFoundation\Response;
use Symfony\Component\Routing\Annotation\Route;

class HomeController extends AbstractController
{
    private $entityManager;

    public function __construct(EntityManagerInterface $entityManager)
    {
        $this->entityManager = $entityManager;
    }

    #[Route('/', name: 'app_home')]
    public function index(): Response
    {
        $latestArticle = $this->entityManager->getRepository(Article::class)->findOneBy([], ['createdAt' => 'DESC']);

        $latestArticleTitle = $latestArticle ? $latestArticle->getTitre() : '';

        return $this->render('home/index.html.twig', [
            'latestArticleTitle' => $latestArticleTitle,
        ]);
    }
}

Voici mon home/index.html.twig

{% extends 'base.html.twig' %}

{% block title %}Accueil{% endblock %}

{% block body %}
    <div class="container-home">
        <div class="search">
            <img src="/img/bubu3.jpg" alt="Background Image" class="background-image">
            <div class="welcome">Explorez notre wiki !</div>
            <form action="{{ path('app_search') }}" method="GET" class="search2">
                <div class="input-wrapper">
                    <input type="search" id="site-search" name="q" placeholder="Rechercher un guide sur le wiki...">
                    <button type="submit">
                        <i class="fa-solid fa-magnifying-glass"></i>
                    </button>
                </div>
            </form>

            <div class="last-guide">
                <h3>Guide récemment mis en ligne</h3>
                <!-- Ajout de lien pour rediriger vers la page Guide -->
                <a href="{{ path('guide_index') }}" class="emplacement">{{ latestArticleTitle }}</a>
            </div>
        </div>
        <div class="actu">
        </div>
    </div>
{% endblock %}

Voici mon guide/index.html.twig

{% extends 'base.html.twig' %}

{% block title %}Guides{% endblock %}

{% block body %}
<div class="container-guide">
    <div class="sidebar">
        <ul>
            <li>
               <h3>Nos guides techniques</h3>
            </li>
        </ul>
        <br>
        <ul>
            {% for category in categories %}
            <li class="category-item">
                {{ category.getTitre() }}
                <ul>
                    {% for subcategory in category.getSousCategories() %}
                    <li class="subcategory-item">&nbsp;{{ subcategory.getTitre() }}</li>
                        <ul>
                            {% for article in subcategory.getArticles() %}
                            <li class="link-item">
                                &nbsp;&nbsp;<a href="#" class="article-link" data-title="{{ article.getTitre() }}" data-article="{{ article.getContenu() }}" data-date="{{ article.getCreatedAt()|date('d/m/Y') }}">{{ article.getTitre() }}</a>
                            </li>
                            {% endfor %}
                        </ul>
                    {% endfor %}
                </ul>
            </li>
            {% endfor %}
        </ul>
    </div>
    <div class="main-content">
        <!-- Utilisation de la classe CSS pour appliquer le padding au titre -->
        <h3 class="article-title" id="articleTitle"></h3>
        <!-- Utilisation de la classe CSS pour le contenu de l'article -->
        <div class="article-content" id="articleContent"></div>
        <div class="article-date" id="articleDate"></div>
    </div>
</div>

<script>
    // Récupérer tous les liens d'article
    const articleLinks = document.querySelectorAll('.article-link');

    // Parcourir chaque lien et ajouter un gestionnaire d'événements de clic
    articleLinks.forEach(link => {
        link.addEventListener('click', function(e) {
            e.preventDefault(); // Empêcher le comportement par défaut du lien

            // Récupérer le titre, le contenu et la date de création de l'article à partir des attributs data
            const articleTitle = this.getAttribute('data-title');
            const articleContent = this.getAttribute('data-article');
            const articleDate = this.getAttribute('data-date');

            // Mettre à jour le titre, le contenu et la date de création de l'article dans la section main-content
            document.getElementById('articleTitle').innerText = articleTitle;
            document.getElementById('articleContent').innerHTML = articleContent;
            document.getElementById('articleDate').innerText = 'Publié le : ' + articleDate;
        });
    });
</script>
{% endblock %}

Guide



Home

Salut, dans ton processus, comment la page guide_index sait-elle qu'elle doit afficher tel article lors de son chargement initial ?

<a href="{{ path('guide_index') }}" class="emplacement">{{ latestArticleTitle }}</a>

Peut être faudrait-il ajouter ici cette information ? par exemple l'id de l'article à afficher et faire ensuite le nécessaire avec cet id pour que guide_index affiche le bon article.

Merci @Saien pour ton retour alors J'ai mis en place cela dans mon home.twig.html

<a href="{{ path('guide_index', {'id': latestArticle.id}) }}" class="emplacement">{{ latestArticle.titre }}</a>

Et ceci dans mon HomeController :

<?php

namespace App\Controller;

use App\Entity\Article;
use Doctrine\ORM\EntityManagerInterface;
use Symfony\Bundle\FrameworkBundle\Controller\AbstractController;
use Symfony\Component\HttpFoundation\Response;
use Symfony\Component\Routing\Annotation\Route;

class HomeController extends AbstractController
{
    private $entityManager;

    public function __construct(EntityManagerInterface $entityManager)
    {
        $this->entityManager = $entityManager;
    }

    #[Route('/', name: 'app_home')]
    public function index(): Response
    {
        $latestArticle = $this->entityManager->getRepository(Article::class)->findOneBy([], ['createdAt' => 'DESC']);

        // Récupérer également l'ID de l'article
        $latestArticleId = $latestArticle ? $latestArticle->getId() : null;

        return $this->render('home/index.html.twig', [
            'latestArticle' => $latestArticle,
            'latestArticleId' => $latestArticleId,
        ]);
    }
}

Du coup il me redirige vers la page guide/index.html.twig mais sans afficher l'article (son contenu)...

Quand je suis dans ma page guide/guide/index.html.twig lorsque je clique sur un article, il m'affiche le contenu et son titre dans le main-content



Voici mon GuideController au passage :

<?php

namespace App\Controller;

use App\Entity\Categorie;
use Doctrine\ORM\EntityManagerInterface;
use Symfony\Bundle\FrameworkBundle\Controller\AbstractController;
use Symfony\Component\HttpFoundation\Response;
use Symfony\Component\Routing\Annotation\Route;

class GuideController extends AbstractController
{
    private $entityManager;

    public function __construct(EntityManagerInterface $entityManager)
    {
        $this->entityManager = $entityManager;
    }

    #[Route('/guide', name: 'guide_index')]
    public function index(): Response
    {
        
        $categories = $this->entityManager->getRepository(Categorie::class)->findAll();
        return $this->render('guide/index.html.twig', [
            'categories' => $categories,
        ]);
    }

}

Merci @Saien pour ton retour alors J'ai mis en place cela dans mon home.twig.html

<a href="{{ path('guide_index', {'id': latestArticle.id}) }}" class="emplacement">{{ latestArticle.titre }}</a>

Et ceci dans mon HomeController :

<?php

namespace App\Controller;

use App\Entity\Article;
use Doctrine\ORM\EntityManagerInterface;
use Symfony\Bundle\FrameworkBundle\Controller\AbstractController;
use Symfony\Component\HttpFoundation\Response;
use Symfony\Component\Routing\Annotation\Route;

class HomeController extends AbstractController
{
    private $entityManager;

    public function __construct(EntityManagerInterface $entityManager)
    {
        $this->entityManager = $entityManager;
    }

    #[Route('/', name: 'app_home')]
    public function index(): Response
    {
        $latestArticle = $this->entityManager->getRepository(Article::class)->findOneBy([], ['createdAt' => 'DESC']);

        // Récupérer également l'ID de l'article
        $latestArticleId = $latestArticle ? $latestArticle->getId() : null;

        return $this->render('home/index.html.twig', [
            'latestArticle' => $latestArticle,
            'latestArticleId' => $latestArticleId,
        ]);
    }
}

Du coup il me redirige vers la page guide/index.html.twig mais sans afficher l'article (son contenu)...

Quand je suis dans ma page guide/guide/index.html.twig lorsque je clique sur un article, il m'affiche le contenu et son titre dans le main-content



Voici mon GuideController au passage :

<?php

namespace App\Controller;

use App\Entity\Categorie;
use Doctrine\ORM\EntityManagerInterface;
use Symfony\Bundle\FrameworkBundle\Controller\AbstractController;
use Symfony\Component\HttpFoundation\Response;
use Symfony\Component\Routing\Annotation\Route;

class GuideController extends AbstractController
{
    private $entityManager;

    public function __construct(EntityManagerInterface $entityManager)
    {
        $this->entityManager = $entityManager;
    }

    #[Route('/guide', name: 'guide_index')]
    public function index(): Response
    {
        
        $categories = $this->entityManager->getRepository(Categorie::class)->findAll();
        return $this->render('guide/index.html.twig', [
            'categories' => $categories,
        ]);
    }

}

Tu penses pas que le problème pourrait venir de mon JS ?