[RESOLU] Raffraichir page sans la recharger

Eléphant du PHP | 282 Messages

08 juin 2019, 00:54

Bonjour !

Je viens de faire une page dont j'aimerais que les résultats se raffraissent sans rechargement de page au clique d'un bouton.
Le script semble fonctionner mais j'ai l'impression que ça me raffrichit deux fois la page d'affilé avant d'arriver sur une page blanche.

Voici mon code :
            <script>
$(document).ready(function() {
  $(".ext").on('click',function(event) {
    var url = $(this).prop('href');
    $("#loadcontent").load(url);
    event.preventDefault();
  });
});
</script>
            <div class="trailer-block row" style="margin-top:0px;">
                <!-- Movie preview item -->
                <?php for ($i = 0; $i <= 7; $i++): ?>
                    <?php if (isset($getListFilm[$i])): ?>
                      <div id="loadcontent">
                        <div class="col-sm-4 col-md-3" style="text-align:center;">
                            <?php
                                if ($getListFilm[$i]['nodeImg'] != '') {
                                    echo l(
                                        '<img alt="" src="' . $baseUrlImg . $getListFilm[$i]['nodeImg'] . '" width="188" height="250">',
                                        ['film', $getListFilm[$i]['id']]
                                    );
                                }
                            ?>
                            <p class="titre_film"><b><?= $getListFilm[$i]['title']; ?></b></p>
                            <div><?php echo notation($getListFilm[$i]['id']) ?></div>
                                        <?php
              if (isset($_SESSION['id'])) {
                $nodeWatchListQuery = $bdd->prepare("
                  SELECT
                    uwl.id
                  FROM `user_watch_list` uwl
                  WHERE
                    uwl.user_id = :user_id
                    AND uwl.node_id = :node_id
                ");
                $nodeWatchListQuery->execute([
                  ':node_id' => $getListFilm[$i]['id'],
                  ':user_id' => $_SESSION['id'],
                ]);

                if ($nodeWatchListQuery->rowCount() > 0) {
                  echo l(
                    'Déjà ajouté à ma watchlist !', '#', [
                      'class' => 'watchlist watch_list_add defaut_lien',
                      'data-id' => $getListFilm[$i]['id'],
                      'data-type' => 'remove',
                      'title' => 'Supprimer de ma watchlist',
                    ]
                  );
                }
                else {
                  echo l(
                    'Envie de voir ce film', '#', [
                      'class' => 'watchlist',
                      'data-id' => $getListFilm[$i]['id'],
                      'data-type' => 'add',
                      'title' => 'Ajouter à ma watchlist !',
                    ]
                  );
                }
              }
              else {
                echo l(
                  'Envie de voir ce film', '#', [
                    'class' => 'watchlist login-window',
                    'title' => 'Connectez-vous pour ajouter à votre watchlist !',
                  ]
                );
              }
            ?>
                        </div></div>
                    <?php endif; ?>
                <?php endfor; ?>
            </div>
            <div class="contenu_center"><a class="btn btn-md btn--warning ext" href="">Charger plus de contenu</a></div>
        </div>
Merci d'avance à ceux qui pourront m'aider dans cette impasse !

Petit nouveau ! | 4 Messages

10 juin 2019, 00:07

Salut, tu ne peux pas exécuté ton code PHP avec ce système puisque le code PHP est exécuté uniquement sur le serveur et non sur le client. Dans ton exemple on voit que tu essais d'appeler ton code PHP avec un code jQuery, donc côté client. Un exemple simple, si tu affiche le code source de ta page, tu ne vois pas le PHP, Javascript non plus ! Il existe une solution c'est de faire des requêtes AJAX en Javascript ou jQuery, ou alors de carrément utiliser un router frontend.

Je t'invites déjà à te renseigner sur la communication HTTP d'une application web, j'ai trouvé ça, le début à l'air pas trop mal : https://romainlebreton.github.io/ProgWe ... lass1.html

Pour AJAX, le mieux ce serait d'apprendre Javascript (ES6+), mais si tu es pressé tu peux aussi le faire avec la lib jQuery, c'est pas trop compliqué et c'est déjà ce que tu utilises: https://openclassrooms.com/fr/courses/1 ... nt-de-ajax (regardes dans les chapitres suivant, tu as aussi des tutoriaux). Le principe c'est de faire une requête HTTP a ton serveur, qui te retournera le résultat du script appelé (ex: localhost/charger_plus.php)

Bon courage, hésites pas à revenir si besoin

Eléphant du PHP | 282 Messages

10 juin 2019, 18:10

C'est exactement ce que je recherchais, merci beaucoup pour ton aide !