Barre de recherche


Maintenant que notre formulaire et que notre script sont fait, nous allons créer une nouvelle page PHP que l'on nommera recherche_utilisateur.php.

Dans cette page nous allons faire une requête SQL afin de récupérer les 10 premières résultats grâce à la variable $user que l'on passe via notre script.


Page recherche_utilisateur.php


<?php
  session_start();
  require_once('../bd/connexionDB.php');

  if(isset($_GET['user'])){
    $user = (String) trim($_GET['user']);

    $req = $DB->query("SELECT *
      FROM utilisateur
      WHERE nom LIKE ?
      LIMIT 10",
      array("$user%"));

    $req = $req->fetchALL();
  
    foreach($req as $r){
      ?>   
        <div style="margin-top: 20px 0; border-bottom: 2px solid #ccc"><?= $r['nom'] . " " . $r['prenom'] ?></div><?php    
    }
  } 
?>


Maintenant que nous avons tout développé nous allons donc finaliser notre page index.php afin d'afficher nos résultats obtenus .


Page index.php


<div class="container">
  <div class="row">
    <div class="col-sm-0 col-md-2 col-lg-3"></div>
    <div class="col-sm-12 col-md-8 col-lg-6">
      <h1 style="text-align: center">Mon site à moi</h1>
      <div class="form-group">
        <input class="form-control" type="text" id="search-user" value="" placeholder="Rechercher un ou plusieurs utilisateurs"/>
      </div>
      <div style="margin-top: 20px">
        <div id="result-search"></div> <!-- C'est ici que nous aurons nos résultats de notre recherche -->
      </div>
    </div>
  </div>
</div>


Et voilà ! Maintenant c'est à votre tour d'essayer !

Si vous avez des idées ou remarques afin d'améliorer le cours n'hésitez pas à en faire part dans les commentaires !

8829 vues
Modifié le 18 mars 2019
Publicité Sitedudev
Cette pub permet au site de vivre ...
Télécharger le code source
Publicité
Cette pub permet au site de vivre ...
Voir d'autres articles
572 vues
Consommation d'API REST
Consommation d'API REST en JavaScriptLa consommation d'API REST en JavaScript est une tâche courante dans le développement web moderne. Les API REST permettent aux applications d'envoyer et de...
JS
1 677 vues
Voir plus de messages (1/2)
Dans cette nouvelle vidéo nous allons ajouter un bouton 'voir plus' qui va nous permettre de voir d'anciens messages. Nous allons commencer par mettre en place le bouton suivi du procédé pour voir...
Créer son site de rencontres
652 vues
Comment ces propriétés affectent le positionnement et la mise en page des éléments
Impact des Propriétés de Marge, Bordure, Rembourrage, Largeur et Hauteur sur le Positionnement et la Mise en Page des ÉlémentsEn CSS, les propriétés de marge, bordure, rembourrage, largeur et...
CSS
633 vues
Les pseudo-classes et pseudo-éléments pour le stylisme conditionnel
Les Pseudo-Classes et Pseudo-Éléments pour le Stylisme ConditionnelEn CSS, les pseudo-classes et les pseudo-éléments permettent d'appliquer des styles à des éléments HTML en fonction de leur...
CSS
588 vues
Affichage de texte avec echo et print
L'affichage de texte est une opération de base en PHP, souvent utilisée pour fournir une sortie à l'utilisateur. Les instructions echo et print sont les principales méthodes utilisées pour...
PHP
680 vues
Variables et types de données
Variables et Types de Données en JavaScript1. Variables :Une variable en JavaScript est un conteneur pour stocker des données. Vous pouvez utiliser des variables pour stocker différentes valeurs...
JS
5 169 vues
Structure de base d'une page HTML
Cours sur la Structure de Base d'une Page HTMLLa structure de base d'une page HTML est essentielle pour créer des sites Web. Comprendre cette structure vous permettra de démarrer efficacement dans...
HTML
1 142 vues
Sélecteurs de classe : appliquer des styles à des groupes d'éléments spécifiques
Sélecteurs de Classe : Appliquer des styles à des groupes d'éléments spécifiquesLes sélecteurs de classe sont des outils puissants en CSS qui permettent d'appliquer des styles à des groupes...
CSS
Publicité
Cette pub permet au site de vivre ...