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 !

7877 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
2 558 vues
Personnaliser sa barre de menu
Nous allons maintenant apprendre à personnaliser notre barre de recherche à partir de l'exemple de celle de Bootstrap.Nous allons également ajouter 2 nouvelles pages PHP que nous nommerons...
Créer son site de rencontres
81 vues
Modification du contenu et des styles
Modification du Contenu et des Styles des Éléments HTML en JavaScriptLa modification du contenu et des styles des éléments HTML est une tâche courante en développement web. Cela permet de...
JS
135 vues
Comprendre les concepts de marge, bordure, rembourrage et largeur/hauteur
Dans CSS, la mise en page des éléments est souvent influencée par quatre concepts clés : la marge, la bordure, le rembourrage et la largeur/hauteur. Comprendre ces concepts est essentiel pour...
CSS
5 017 vues
Créer son blog
Développer son Blog de A à ZAprès avoir terminer les articles pour développer votre Forum de A à Z maintenant nous allons nous attaquer à la création d'un blog complet !Pour...
Créer son site
1 680 vues
Envoyer un message sans recharger la page (1/2)
Nous allons améliorer notre messagerie interne vu que nous pouvons désormais envoyer et recevoir des messages.Pour cela nous allons utiliser du JavaScript avec de l'Ajax afin de faire des...
Créer son site de rencontres
141 vues
Propriétés CSS : comprendre les différentes propriétés et leurs valeurs
Propriétés CSS : Comprendre les différentes propriétés et leurs valeursLes propriétés CSS sont des instructions qui contrôlent l'apparence et le comportement des éléments HTML sur une page...
CSS
13 054 vues
Notre base de données
Avant d'entamer le développement de notre futur site il nous faut une base de données afin de pouvoir ajouter, modifier ou de supprimer des informations.Étapes...
Créer son site
85 vues
Tableaux : création, accès aux éléments, méthodes
Tableaux en JavaScript1. Création de Tableaux :Un tableau en JavaScript est une structure de données permettant de stocker plusieurs valeurs dans une seule variable. Vous pouvez créer un tableau...
JS
Publicité
Cette pub permet au site de vivre ...