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 !

9234 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 665 vues
Nesting : Organiser le code CSS en utilisant le nesting pour des sélecteurs imbriqués
Nesting en SASS : Organiser le code CSS avec des sélecteurs imbriqués1. Utilisation du nesting :En SASS, vous pouvez organiser votre code CSS en utilisant le nesting pour des sélecteurs...
Sass
1 415 vues
Flexbox : créer des mises en page flexibles et responsives
Flexbox : Créer des Mises en Page Flexibles et ResponsivesFlexbox est une méthode de disposition en CSS qui permet de créer des mises en page flexibles et responsives. Il offre un contrôle...
CSS
1 176 vues
Emplacement du Fichier .htaccess
L'emplacement où vous placez votre fichier .htaccess est crucial pour qu'il fonctionne correctement sur votre site web. Dans ce cours, nous allons apprendre où placer le fichier .htaccess pour...
HTACCESS
2 180 vues
Voir plus de messages (2/2)
Dans la suite de cette vidéo nous allons continuer notre système pour voir plus de messages. Nous allons finaliser la disparition du bouton ‘voir plus’ lorsqu’il n’y aura plus de messages...
Créer son site de rencontres
5 633 vues
Les outils pour développer
Avant de vous lancer dans le développement il reste encore quelques prérequis qui sont les logiciels que vous allez utiliser afin de concevoir votre site !Ce qui vous manque actuellement c'est...
Créer son site
3 259 vues
Introduction à SQL
SQL, ou Structured Query Language, est un langage de programmation standard utilisé pour communiquer avec et manipuler des bases de données relationnelles. Il est largement utilisé dans le domaine...
SQL
920 vues
Comparaison avec d'autres langages de programmation
Comparaison de JavaScript avec d'autres langages de programmationJavaScript est un langage de programmation unique avec ses propres caractéristiques et particularités. Comprendre comment il se...
JS
943 vues
Utilisation des éléments <input>, <textarea>, <select> et <button>
Utilisation des éléments <input>, <textarea>, <select> et <button>Dans un formulaire HTML, différents éléments sont utilisés pour collecter des données de...
HTML
Publicité
Cette pub permet au site de vivre ...