Ajuda com um AJAX PHP e MYSQL Live Search!

Question

Eu estou tentando criar uma pesquisa ao vivo do Ajax para o meu site. Eu atualmente pode consultar o banco de dados por títulos e exibi-los sob a minha busca (ver Fig 1.0), no entanto eu preciso para torná-los selecionáveis ??de modo que quando você faz selecioná-los, ele irá definir o valor de entrada para esse título, muito parecido em busca wikipdia Wikipedia Search . O exemplo wikipedia é basicamente o que eu estou procurando. Qualquer ajuda seria ótimo.

Obrigado, CHL Reino Unido

My Search até agora http://www.webquark.co.uk/Search.bmp

Figura 1.0

CÓDIGO: PHP pesquisa DB

    <?

  // Get value coming from request
  $search = mysql_real_escape_string ($_GET['search']);


  // Connect to DB
  mysql_connect("localhost", "****", "****") or die(mysql_error()) ;
mysql_select_db("*****") or die(mysql_error()) ;
 $result = mysql_query("SELECT * FROM dbArticle WHERE title LIKE '%$search%' OR type LIKE '%$search%'  OR username LIKE '%$search%'");
  while($row = mysql_fetch_array($result))
  // Check if name exists in table
  if (!empty($row['title'])) {
  echo "".$row['title']."<br />";}
  if (!empty($row['type'])) {
  echo "".$row['type']."<br />";}
  if (!empty($row['username'])) {
  echo "".$row['username']."<br />";}
   //Close connection
  mysql_close();


?>

CÓDIGO: PHP Pesquisa de entrada

<div id="navSearch">
  <form method="post" action="index.php?pageContent=search">
  <li><input type="text" maxlength="30" size="22" name="search" onkeyup="send_requestSearch(this);"/> </li>
  <li><input type="submit" value="Search" name="submit"/></li>
  <div class="liveSearch" id="livesearch"></div>
  </form>

Se você precisa ver o meu Javascript me avise.

Answer 1

O controle que você está procurando é chamado de suggester. Tente pesquisar no Google por "sugestão ajax". Você vai encontrar alguns tutoriais sobre como fazê-lo. Aqui está um: ligação

Answer 2

Você provavelmente precisará fazer cada resultado de pesquisa retornado JavaScript habilitado para que, com um onclick ele preenche o seu valor para o texto de entrada. Tendo o elemento de entrada de texto identificada com um id-propriedade ajudaria alvejando-lo um pouco. Tenho certeza que você pode descobrir o resto. Eu comecei a gostar JQuery com exatamente estes tipos de tarefas.

Você também provavelmente vai querer ter os resultados para que a regra CSS "cursor: pointer" para que ele se parece com um item de clickable.