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 !

8669 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
542 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
567 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
689 vues
Sélection d'éléments HTML
Sélection d'Éléments HTML en JavaScriptLa sélection d'éléments HTML est une opération fondamentale en JavaScript. Cela permet d'interagir avec les éléments de la page web, de modifier leur...
JS
4 071 vues
Créer un article
Créer un articleNous allons créer une nouvelle page que l'on nommera creer_article.php. Cette page permettra de créer un article qui sera visible sur le blog.Nous allons modifier notre...
Créer son site
2 228 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
441 vues
Opérateurs logiques (&&, ||, !)
Les opérateurs logiques en PHP sont utilisés pour combiner des expressions conditionnelles et produire des résultats basés sur la logique booléenne. Voici les principaux opérateurs logiques en...
PHP
3 537 vues
Mise en évidence du texte avec <em>, <strong>, <u> et <s>
Mise en évidence du texte avec <em>, <strong>, <u> et <s>Les balises <em>, <strong>, <u> et <s> sont utilisées pour mettre en évidence le texte dans...
HTML
1 058 vues
Gestion des événements : click, submit, keydown, etc.
Gestion des Événements en JavaScriptLa gestion des événements en JavaScript permet d'interagir avec les actions de l'utilisateur sur une page web, telles que les clics de souris, les soumissions...
JS
Publicité
Cette pub permet au site de vivre ...