DEV Community πŸ‘©β€πŸ’»πŸ‘¨β€πŸ’»

Fredouze
Fredouze

Posted on

I wold like creat search engine whit React/php

Hello every body! Il french and sory for my rough english. I creat now a search engine whit React and php but they are nothing result, and nothing message for error exept "Firefox cannot establish a connection to the server at ws://localhost:3000/ws." in a console.

This is my App for react:

import React from 'react'
import Turnstone from 'turnstone'

const styles = {
  input: 'border p-2 bg-white w-full',
  listbox: 'border p-2 bg-white w-full'
}

// Set up listbox contents.
const listbox = {

  data: (query) =>
    fetch(`http://essai/mr/query.php?query=${encodeURIComponent(query)}`)
      .then(res => res.json())
}




console.log(listbox);

export default function BasicExample() {
  return <Turnstone id="autocomplete" listbox={listbox} styles={styles} typeahead={false} />
}
Enter fullscreen mode Exit fullscreen mode

And this is my PHP is name query in my Wamp.

<?php


header('Access-Control-Allow-Origin: http://localhost:3000');


 header("Content-Type: application/json");

$nbr = 0;

$data = array();

$output = '';

$name = $_GET['query'];




//fetch.php
$connect = mysqli_connect("localhost", "root", "", "immoffre");
$output = '';
if(isset($name))
{
 $search = mysqli_real_escape_string($connect, $name);
 $query =  "
 SELECT * FROM villes_france 
 WHERE ville_nom LIKE '%" . $search . "%'
 OR ville_slug LIKE '%" . $search . "%' 
 OR ville_code_postal LIKE '%" . $search . "%' 
 LIMIT 5
";
}
else
{
 $query = "
  SELECT * FROM tbl_customer ORDER BY CustomerID
 ";
}
$result = mysqli_query($connect, $query);
if(mysqli_num_rows($result) > 0)
{

 while($row = mysqli_fetch_array($result))
 {


    $nbr++;
    $data[$nbr]   =   $row["ville_nom"];




 }

}

echo json_encode($data);


?>
Enter fullscreen mode Exit fullscreen mode

Thank you for your consideration!

Top comments (0)

DEV

Thank you.

Β 
Thanks for visiting DEV, we’ve worked really hard to cultivate this great community and would love to have you join us. If you’d like to create an account, you can sign up here.