Bonjour, travaillant sous Symfony 5 je suis face à un problème que je n'arrive pas à résoudre depuis plusieurs jours. 

Je travail actuellement avec un formulaire regroupant 25 questions affiliées à 8 catégories différentes, pour le moment j'arrive à afficher mon formulaire en entiers, et mon souhait serai de paginer ce formulaire par catégorie de question, j'ai essayé avec les outils de symfony mais rien à faire cela ne veut pas fonctionner, j'ai donc décidé d'utiliser du javascript pour le faire, ma pagination est fonctionnelle mais pour le moment cela fonctionne avec un nombre d'élément précis par page et non pas par catégorie.

Je voudrais donc savoir comment faire passer l'id de ces dites catégories dans ma fonction JS pour que ma pagination soit plus dynamique ? 

Merci à vous

Salut

Pour ecrire du  php dans du javascript tu peux faire ceci:

echo "<script>"; // Le script en question
echo " var id = '" . $mon_id . "' ;"; // sans les ' ' si c'est un entier
echo " ...autre chose";

Donc tu ecris ta fonction javascript avec du php, ou juste une partie de ta fonction. Mais elle sera dans un fichier php et non Js.

Sinon, je pense que c'est bien possible de resoudre ton probleme en php.

Bonjour,

Tu peux montrer ton code actuel (côté js et serveur) car passer un paramètre a une route à partir de javascript n'a rien de particulier.

Par ailleurs, il y a aussi un bundle : https://github.com/FriendsOfSymfony/FOSJsRoutingBundle

Bien que la doc ne soit pas très à jour, le composer indique qu'il fonctionne pour SF 5.4 et 6.0

A+

Bonjour, déjà merci pour réponses si rapide 

JE vous partage le code : 

class TestControllerBisController extends AbstractController
{
    //Routing de l'url d'accès à ce controller et aux vues associées
    /**
     * @Route("/test/controller/bis", name="test_controller_bis")
     */
    public function test(Request $request, QuestionsRepository $questionsRepository, EntityManagerInterface $entityManager,
                         CategoriesRepository $categoriesRepository,
                         AdherentsRepository $adherentsRepository): Response
    {
        // Si aucun utilisateur n'est connecté il est renvoyé automatiquement sur la page de login
        if ($this->getUser() != null) {

            // création d'un nouveau formulaire
            $formulaire = new Formulaire();
            // on associe l'utilisateur connecté au formulaire
            $formulaire->setUtilisateur($this->getUser());
            // recherche de la liste de toutes les questions
            $questions = $questionsRepository->findAll();
            // on insère les questions dans le nouveau formulaire
            foreach ($questions as $question) {
                $reponse = new Reponse();
                $reponse->setFormulaire($formulaire);
                $reponse->setQuestion($question);
                $formulaire->addReponse($reponse);
            }
            $adherents = $adherentsRepository->findAll();


            //Ajout fonction echo recupération ajax



            //On cherche une donnée precise avec le "findby"
            $question1 = $this->getDoctrine()->getRepository(Questions::class)->findBy(
                array('categories' => '1')
            );
            $categorie1= $this->getDoctrine()->getRepository(Categories::class)->
            findBy(
                array('libelle' => 'Vos chantiers'),
            );
            $categorie2 = $this->getDoctrine()->getRepository(Categories::class)->
            findBy(
                array('libelle' => 'Relations commerciales'),
            );
            $categorie3 = $this->getDoctrine()->getRepository(Categories::class)->
            findBy(
                array('libelle' => 'Maîtrise des délais et des coûts'),
            );

            //On recupère toutes les données d'une table
            $allCategories = $categoriesRepository->findAll();


            // création du formulaire
            $formFormulaire = $this->createForm(FormulaireFormType::class, $formulaire);

            // On traire le formulaire
            $formFormulaire->handleRequest($request);

            //Conditions de validation du formulaire
            if ($formFormulaire->isSubmitted() && $formFormulaire->isValid()) {

                // traitement de sauvegarde du formulaire
                $entityManager->persist($formulaire);
                $entityManager->flush();
                return $this->redirectToRoute('home');
            }

            //On récupère l'intégralité des données d'une table avec le "findAll"
            $listAllQuestions =  $questionsRepository->findAll();

            //On fournit les données de traitement à la vue
            return $this->render('test_controller_bis/index.html.twig', [
                // On instancie le formulaire dans twig(la vue) avec "createView"
                'formFormulaire' => $formFormulaire->createView(),
                'categorie1' => $categorie1,
                'categorie2' => $categorie2,
                'question1' => $question1,
                'listAllQuestions' => $listAllQuestions,
                'categorie3'=>$categorie3,
                'allCategories'=>$allCategories,
                'adherents' => $adherents,
            ]);
        } else {
            // On renvoie vers la page de login
            return $this->redirectToRoute('app_login');
        }
    }
}

Ceci est mon controller test, donc quelques méthodes ne servent pas mais c'est normal 

   <div class="container emailUser" style="width: 75%">
        <div class="container" style="text-align: center;">
            <h2>Votre avis est important pour CFBL</h2>
        </div>
        <div style="border-bottom: 1px solid rgb(0, 118, 51); font-size : 13pt">
            <p>La satisfaction des adhérents est la priorité de CFBL.</p>
            <p>En répondant à ce questionnaire, vous aidez CFBL à améliorer la qualité de ses prestations futures.</p>
            <p>Merci de nous valider les informations suivantes :</p>
        </div>
        <div style="padding-top: 15px">
            {% if app.user %}
                <div class="noPartage">
                    <svg id="noVisionCompte" xmlns="http://www.w3.org/2000/svg" width="25" height="25"
                         fill="currentColor"
                         class="bi bi-eye-slash" viewBox="0 0 16 16">
                        <path d="M13.359 11.238C15.06 9.72 16 8 16 8s-3-5.5-8-5.5a7.028 7.028 0 0 0-2.79.588l.77.771A5.944
                         5.944 0 0 1 8 3.5c2.12 0 3.879 1.168 5.168 2.457A13.134 13.134 0 0 1 14.828 8c-.058.087-.122.183-.195.288-.335.48-.83
                          1.12-1.465 1.755-.165.165-.337.328-.517.486l.708.709z"/>
                        <path d="M11.297 9.176a3.5 3.5 0 0 0-4.474-4.474l.823.823a2.5 2.5 0 0 1 2.829 2.829l.822.822zm-2.943
                         1.299.822.822a3.5 3.5 0 0 1-4.474-4.474l.823.823a2.5 2.5 0 0 0 2.829 2.829z"/>
                        <path d="M3.35 5.47c-.18.16-.353.322-.518.487A13.134 13.134 0 0 0 1.172 8l.195.288c.335.48.83 1.12 1.465
                         1.755C4.121 11.332 5.881 12.5 8 12.5c.716 0 1.39-.133 2.02-.36l.77.772A7.029 7.029 0 0 1 8 13.5C3 13.5 0
                         8 0 8s.939-1.721 2.641-3.238l.708.709zm10.296 8.884-12-12 .708-.708 12 12-.708.708z"/>
                    </svg> {{ app.user.login }} (non partagé)
                </div>
                <a style="padding : 0; padding-left: 15px" class="nav-link active"
                   href="{{ path('app_logout') }}"><small>Changer de
                        compte</small></a>
            {% endif %}

            <p style="color : red">* Champ obligatoire</p>
        </div>
    </div>

    <div class="container tableau">
        <div>
            <div class="d-flex">
                <h2>Vos coordonnées</h2>
            </div>
            <div class="container grid">
                {% for adherent in adherents %}
                    {% if adherent.id == 1 %}
                        <div>Civilié : {{ adherent.civilite }}</div>
                        <div>Nom : {{ adherent.nom }}</div>
                        <div>Prénom : {{ adherent.prenom }}</div>
                        <div>Email : {{ adherent.mail }}</div>
                        <div>Code Adhérent : {{ adherent.codeAdherent }}</div>
                    {% endif %}
                {% endfor %}
            </div>
        </div>
    </div>

    </div>
    <div class="container tableau" style="margin-bottom: 50px; width: 51%">

        {{ form_start(formFormulaire, {attr: {'novalidate': 'novalidate'}}) }}
        <h1>Formulaire</h1>

        {% for reponse in formFormulaire.reponses %}
            <tr class="reponses">

                <td>
{#                    <div class="test" data-bs-target="{{ categorie1 }}"></div>#}
{#                    #}{# TODO : ne pas afficher la catégorie si la même que la réponse précédente #}
{#                    {% if reponse.vars.data.question.categories.id == 1 %}#}
{#                        {{ reponse.vars.data.question.categories.libelle }}#}
{#                    {% endif %}#}
                </td>

                <div class="list_item">
                    <td>
                            {{ reponse.vars.data.question.question }}<span style="color: red"> *</span>
                            {{ form_row(reponse) }}
                    </td>
                </div>
            </tr>
        {% endfor %}
        <br>
        <button type="submit" class="btn btn-success">Valider</button>

        <ul id="pagination_demo"></ul>

        {{ form_end(formFormulaire) }}
    </div>



    {#Balise pour le javascript#}
    <script>
        pageSize = 4;
        var pageCount = $(".list_item").length / pageSize;
        for (var i = 0 ; i<pageCount;i++) {
            $("#pagination_demo").append('<li><a href="#">' + (i + 1) + '</a></li>');
        }
        $('#pagination_demo li').first().find("a").addClass("current")
        showPage = function(page) {
            $(".list_item").hide();
            $(".list_item").each(function (n){
                if (n >= pageSize * (page - 1 ) && n < pageSize * page)
                    $(this).show();
            });
        }
        showPage(1);

        $("#pagination_demo li a").click(function() {
            $("#pagination_demo li a").removeClass("current");
            $(this).addClass("current");
            showPage(parseInt($(this).text()))
        });
    </script>

{% endblock %}

ceci est ma vu + le petit bout de js qui me sert de pagination 

Je vais aller voir du côter du bundle aussi merci pour l'info

Moi je fais comme indiqué dans la doc :

https://symfony.com/doc/current/frontend/encore/server-data.html

A+