Autocomplete

Fermé
delaville81 Messages postés 188 Date d'inscription jeudi 6 novembre 2008 Statut Membre Dernière intervention 12 avril 2024 - 30 mars 2021 à 15:23
delaville81 Messages postés 188 Date d'inscription jeudi 6 novembre 2008 Statut Membre Dernière intervention 12 avril 2024 - 1 avril 2021 à 17:08
Bonjour chers confères,
J'ai trouvé ce code pour crée un input d'autocomplete sur ce site
https://github.com/cluemediator/autocomplete-textbox-ajax-php

J'ai fais sur mon serveur OVH comme indiqué (en mettant mes identifiants de connexion à la BDD), mais rien ne fonctionne

J'aurais bien besoin de votre aide

Meci d'avance


Configuration: Macintosh / Chrome 89.0.4389.90

9 réponses

jordane45 Messages postés 38145 Date d'inscription mercredi 22 octobre 2003 Statut Modérateur Dernière intervention 25 avril 2024 4 650
30 mars 2021 à 15:46
Bonjour,

Va falloir être un peu plus précis
Qu'as tu fais au juste ?
As tu créé la table ?
Quel code as tu réellement écrit ?
As tu inclus la librairie jquery à ta page ?
As tu des erreurs dans la cosnole Javascript de ton navigateur ?

NB: vu que ça utiliser l'ajax, pour correctement le debuguer, je t'invite fortement à le faire depuis le navigateur Firefox et à cocher, dans la console, le debugage XHR.


0
delaville81 Messages postés 188 Date d'inscription jeudi 6 novembre 2008 Statut Membre Dernière intervention 12 avril 2024
31 mars 2021 à 11:46
index1.php
<!doctype html>
<html lang="en">
<head>
  <meta charset="utf-8">
  <title>Demo</title>
  <link rel="stylesheet" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.10.1/themes/base/minified/jquery-ui.min.css" type="text/css" /> 
</head>
<body> 

    <form action='' method='post'>
        <p><label>Country:</label><input type='text' name='country' value='' class='auto' autocomplete="off"></p>
    </form>

<script type="text/javascript" src="http://code.jquery.com/jquery-1.9.1.min.js"></script>
<script type="text/javascript" src="http://code.jquery.com/ui/1.10.1/jquery-ui.min.js"></script>    
<script type="text/javascript">
$(function(){
    
    //autocomplete
    $(".auto").autocomplete({
        source: "ajax-city-search.php",
        minLength: 1
    });                

});
</script>
</body>
</html>


connection.php
<?php
	$dbhost = 'mon host';
	$dbuser = 'utilisateur';
	$dbpass = 'mon pws';
	$db = 'nom de la base';
	$conn = mysqli_connect($dbhost, $dbuser, $dbpass , $db) or die($conn);	
?>


ajax-city-search.php
<?php
require_once('connection.php');

function get_city($conn , $term){	
	$query = "SELECT * FROM city WHERE city_name LIKE '%".$term."%' ORDER BY city_name ASC";
	$result = mysqli_query($conn, $query);	
	$data = mysqli_fetch_all($result,MYSQLI_ASSOC);
	return $data;	
}

if (isset($_GET['term'])) {
	$getCity = get_city($conn, $_GET['term']);
	$cityList = array();
	foreach($getCity as $city){
		$cityList[] = $city['city_name'];
	}
	echo json_encode($cityList);
}
?>



La table est bien crée.

La console javascript me renvoi


Mixed Content: The page at 'https://url de mon site' was loaded over HTTPS, but requested an insecure stylesheet 'http://ajax.googleapis.com/ajax/libs/jqueryui/1.10.1/themes/base/minified/jquery-ui.min.css'. This request has been blocked; the content must be served over HTTPS.
index1.php:1 Mixed Content: The page at 'https://url de mon site' was loaded over HTTPS, but requested an insecure script 'http://code.jquery.com/jquery-1.9.1.min.js'. This request has been blocked; the content must be served over HTTPS.
index1.php:1 Mixed Content: The page at 'https://url de mon site' was loaded over HTTPS, but requested an insecure script 'http://code.jquery.com/ui/1.10.1/jquery-ui.min.js'. This request has been blocked; the content must be served over HTTPS.
index1.php:17 Uncaught ReferenceError: $ is not defined
at index1.php:17

0
jordane45 Messages postés 38145 Date d'inscription mercredi 22 octobre 2003 Statut Modérateur Dernière intervention 25 avril 2024 4 650
31 mars 2021 à 12:07
Il faut que tu charges les librairie jQuery UI et JQuery en HTTPS et non en HTTP tout court.
Carla, la console m'indique que jQuery n'est pas chargé
0
delaville81 Messages postés 188 Date d'inscription jeudi 6 novembre 2008 Statut Membre Dernière intervention 12 avril 2024
31 mars 2021 à 13:17
Meci pour ta réponse.
J'ai toujours une erreur

GET https://url du site/ajax-city-search.php?term=c 500

0
jordane45 Messages postés 38145 Date d'inscription mercredi 22 octobre 2003 Statut Modérateur Dernière intervention 25 avril 2024 4 650
31 mars 2021 à 13:43
Il faut metttre le chemin vers ton fichier php...
Qu'as tu mis ?
0

Vous n’avez pas trouvé la réponse que vous recherchez ?

Posez votre question
delaville81 Messages postés 188 Date d'inscription jeudi 6 novembre 2008 Statut Membre Dernière intervention 12 avril 2024
31 mars 2021 à 14:23
$(function(){
    
    //autocomplete
    $(".auto").autocomplete({
        source: "ajax-city-search.php",
        minLength: 1
    });                

});

0
jordane45 Messages postés 38145 Date d'inscription mercredi 22 octobre 2003 Statut Modérateur Dernière intervention 25 avril 2024 4 650
31 mars 2021 à 16:21
Par contre, une erreur 500 indique un souci au niveau de ton code php.

Il faudrait activer l'affichage des erreurs php et gérer les erreurs mysqli
0
delaville81 Messages postés 188 Date d'inscription jeudi 6 novembre 2008 Statut Membre Dernière intervention 12 avril 2024
Modifié le 31 mars 2021 à 16:55
J'ai mis :
error_reporting(E_ALL);
ini_set('display_errors', TRUE);
ini_set('display_startup_errors', TRUE);


aucun retour.
La console JS n'affiche rien
Mais ça ne marche toujours pas

0
jordane45 Messages postés 38145 Date d'inscription mercredi 22 octobre 2003 Statut Modérateur Dernière intervention 25 avril 2024 4 650
31 mars 2021 à 18:21
Et la gestion des erreurs mysqli ?
Car si tu as une erreur 500.. le souci se trouve au niveau du script php
0
delaville81 Messages postés 188 Date d'inscription jeudi 6 novembre 2008 Statut Membre Dernière intervention 12 avril 2024
1 avril 2021 à 12:04
<?php
$link = mysqli_connect("localhost", "my_user", "my_password", "world");
 
/* Vérification de la connexion */
if (mysqli_connect_errno()) {
	printf("Échec de la connexion : %s\n", mysqli_connect_error());
	exit();
}
 
if (!mysqli_query($link, "SET a=1")) {
	printf("Message d'erreur : %s\n", mysqli_error($link));
}
 
/* Fermeture de la connexion */
mysqli_close($link);
?>


En changeant "localhost", "my_user", "my_password", "world" par les codes de BDD.
Me retourne

Message d'erreur : Unknown system variable 'a'
0
jordane45 Messages postés 38145 Date d'inscription mercredi 22 octobre 2003 Statut Modérateur Dernière intervention 25 avril 2024 4 650
Modifié le 1 avril 2021 à 12:18
Ben oui.. je ne pense pas que la requête que tu essayes d'exécuter soit celle que tu voulais au départ
0
delaville81 Messages postés 188 Date d'inscription jeudi 6 novembre 2008 Statut Membre Dernière intervention 12 avril 2024
1 avril 2021 à 12:30
Vu que rien ne fonctionne, connais tu un tuto clair sur l'autocomplete en JS .
J'ai l'impression que le JSON ne fonctionne pas sur mon hébergeur (OVH). Aucune des fonctions JS/ AJAX / PHP que j'ai écrite n'a fonctionné.
0
jordane45 Messages postés 38145 Date d'inscription mercredi 22 octobre 2003 Statut Modérateur Dernière intervention 25 avril 2024 4 650
1 avril 2021 à 13:21
voici à quoi devrait ressembler ton code
<?php 
// fichier : connection.php
$dbhost = 'mon host';
$dbuser = 'utilisateur';
$dbpass = 'mon pws';
$db = 'nom de la base';
$conn = mysqli_connect($dbhost, $dbuser, $dbpass , $db);	
/* Vérification de la connexion */
if (mysqli_connect_errno()) {
  printf("Échec de la connexion : %s\n", mysqli_connect_error());
  exit();
}
 
 ?>
 


<?php
// Fichier : ajax-city-search.php
//affichage des erreurs php
error_reporting(E_ALL);
ini_set('display_errors', TRUE);
ini_set('display_startup_errors', TRUE);

// connexion à la bdd
require_once('connection.php');

 
function get_city($term){	
  global $conn;
	$query = "SELECT * FROM city WHERE city_name LIKE '%".$term."%' ORDER BY city_name ASC";
  if (!mysqli_query($conn, $result = mysqli_query($conn, $query))) {
      echo json_encode([ mysqli_error($link)]);
  }
	$data = mysqli_fetch_all($result,MYSQLI_ASSOC);
	return $data;	
}

$cityList = array();
if (isset($_GET['term'])) {
	$getCity = get_city($_GET['term']);
	if(!empty($getCity)){
	foreach($getCity as $city){
		$cityList[] = $city['city_name'];
	}
  }else{
    echo json_encode(['AUCUNE DONNEE TROUVEE']);
  }  
}

echo json_encode($cityList);


NB: Pour pouvoir debuguer de l'ajax, il faut que tu utilises FireFox et que tu actives, dans la console js, le debugage XHR.
0
delaville81 Messages postés 188 Date d'inscription jeudi 6 novembre 2008 Statut Membre Dernière intervention 12 avril 2024
1 avril 2021 à 17:08
J'ai changé le fichier index1.php avec la version trouvée sur le page Github de la fonction
<!doctype html>
<html lang="en">
<head>
<!-- jQuery -->
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
 
<!-- jQuery UI -->
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/jqueryui/1.12.1/jquery-ui.css" />
<script src="https://code.jquery.com/ui/1.12.1/jquery-ui.min.js"></script>
 
<!-- Bootstrap CSS -->
<link href="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css" rel="stylesheet">
</head>

<body>
<div class="container">
  <h5 class="mt-4">Autocomplete Textbox Using PHP, MySQL and jQuery - <a href="https://www.cluemediator.com/" target="_blank">Clue Mediator</a></h5>
  <div class="row">
     <div class="col-md-4">
     <label>City:</label>
     <input type="text" name="city" id="search_city" placeholder="Type to search..." class="form-control">  
     </div>
  </div>
</div>
<script type="text/javascript">
  $(function(){
     $( "#search_city" ).autocomplete({
       source: 'ajax-city-search.php',
       minLenght: 1
     });
  });
</script>
</body>
</html>



XHR GET https://URLDeMonSite.com/ajax-city-search.php?term=a
[HTTP/2 200 OK 58ms]

Mais aucune liste de choix ne s'affiche
0