2011-06-16 64 views
0

我想將「Jquery UI Autocomplete with multiple values」應用於一個註冊表單輸入字段。請幫我解決自動完成問題

我想要做什麼:當訪客輸入現有用戶的名字到這個輸入字段時,首先,腳本搜索名字存在,完成它(如果存在),添加逗號。用戶可以輸入第二,第三...現有的用戶名到這個字段,每次腳本都會自動完成。當訪問者點擊提交按鈕時,PHP搜索這個用戶名的id,創建id的數組,將它添加到db表中的新用戶「friends」字段。

我的代碼:

HTML

<form action="index.php" method="post">  
<input class="std" type="text" name="friends" id="friends"/> 
<input type="submit" name="submit"> 
</form> 

jQuery的

$(function() { 
    function split(val) { 
     return val.split(/,\s*/); 
    } 
    function extractLast(term) { 
     return split(term ).pop(); 
    } 

    $("#friends") 
     // don't navigate away from the field on tab when selecting an item 
     .bind("keydown", function(event) { 
      if (event.keyCode === $.ui.keyCode.TAB && 
        $(this).data("autocomplete").menu.active) { 
       event.preventDefault(); 
      } 
     }) 
     .autocomplete({ 
      source: function(request, response) { 
       $.getJSON("search.php", { 
        term: extractLast(request.term) 
       }, response); 
      }, 
      search: function() { 
       // custom minLength 
       var term = extractLast(this.value); 
       if (term.length < 2) { 
        return false; 
       } 
      }, 
      focus: function() { 
       // prevent value inserted on focus 
       return false; 
      }, 
      select: function(event, ui) { 
       var terms = split(this.value); 
       // remove the current input 
       terms.pop(); 
       // add the selected item 
       terms.push(ui.item.value); 
       // add placeholder to get the comma-and-space at the end 
       terms.push(""); 
       this.value = terms.join(", "); 
       return false; 
      } 
     }); 
}); 

該位置是完美的作品樣本文件夾原來的PHP文件。但我想從數據庫,而不是陣列
原始的search.php

$q = strtolower($_GET["term"]); 
if (!$q) return; 
$items = array(
"Great Bittern"=>"Botaurus stellaris", 
"Little Grebe"=>"Tachybaptus ruficollis", 
"Black-necked Grebe"=>"Podiceps nigricollis", 
"Little Bittern"=>"Ixobrychus minutus", 
"Black-crowned Night Heron"=>"Nycticorax nycticorax", 
"Purple Heron"=>"Ardea purpurea", 
"White Stork"=>"Ciconia ciconia", 
"Spoonbill"=>"Platalea leucorodia", 
"Red-crested Pochard"=>"Netta rufina", 
"Common Eider"=>"Somateria mollissima", 
"Red Kite"=>"Milvus milvus", 

); 

function array_to_json($array){ 

    if(!is_array($array)){ 
     return false; 
    } 

    $associative = count(array_diff(array_keys($array), array_keys(array_keys($array)))); 
    if($associative){ 

     $construct = array(); 
     foreach($array as $key => $value){ 

      // We first copy each key/value pair into a staging array, 
      // formatting each key and value properly as we go. 

      // Format the key: 
      if(is_numeric($key)){ 
       $key = "key_$key"; 
      } 
      $key = "\"".addslashes($key)."\""; 

      // Format the value: 
      if(is_array($value)){ 
       $value = array_to_json($value); 
      } else if(!is_numeric($value) || is_string($value)){ 
       $value = "\"".addslashes($value)."\""; 
      } 

      // Add to staging array: 
      $construct[] = "$key: $value"; 
     } 

     // Then we collapse the staging array into the JSON form: 
     $result = "{ " . implode(", ", $construct) . " }"; 

    } else { // If the array is a vector (not associative): 

     $construct = array(); 
     foreach($array as $value){ 

      // Format the value: 
      if(is_array($value)){ 
       $value = array_to_json($value); 
      } else if(!is_numeric($value) || is_string($value)){ 
       $value = "'".addslashes($value)."'"; 
      } 

      // Add to staging array: 
      $construct[] = $value; 
     } 

     // Then we collapse the staging array into the JSON form: 
     $result = "[ " . implode(", ", $construct) . " ]"; 
    } 

    return $result; 
} 

$result = array(); 
foreach ($items as $key=>$value) { 
    if (strpos(strtolower($key), $q) !== false) { 
     array_push($result, array("id"=>$value, "label"=>$key, "value" => strip_tags($key))); 
    } 
    if (count($result) > 11) 
     break; 
} 
echo array_to_json($result); 

更改的search.php

$conn = mysql_connect("localhost", "user", "pass"); 
mysql_select_db("db", $conn); 
$q = strtolower($_GET["term"]); 
$query = mysql_query("select fullname from usr_table where fullname like %$q%"); 
$results = array(); 
while ($row = mysql_fetch_array($query)) { 
    array_push($results, $row); 
} 
echo json_encode($results); 

自動完成功能不適合我的工作來獲取。找不到錯誤的代碼部分。請幫忙解決這個問題。對不起,我的英文不好

回答

0

你提到你想創建一個ID數組(最有可能與每個搜索到的名字相關聯)?

在您的SQL語句中,包含您的ID字段。

$query = mysql_query("select id, fullname from usr_table where fullname like %$q%"); 

然後,而不是

array_push($results,$row) 

嘗試:

$results[] = array($row[0] => $row[1]); 

這應該遵循相同的陣列結構從search.php中的靜態數組您修改它之前之後是JSON編碼。我不知道,你的自動完成就會搶你的作爲輸出的結果,所以這種嘗試,以及(switch row[0] with row[1]

$results[] = array($row[1] => $row[0]); 

編輯:

現在,我知道什麼是JSON編碼陣列需要看看喜歡。請改爲:

$results[] = array ("id" => $row[0] , "label" => $row[1], "value" => $row[1]); 

上面的代碼將數組追加到結果數組中。讓我知道這個是否奏效。它相當於array_push

array_push($results, array ("id" => $row[0] , "label" => $row[1], "value" => $row[1])); 
+0

thx for reply,我試過但沒有成功。與靜態一個完美的作品。我不知道該怎麼做(( – 2011-06-16 15:51:00

+0

好,我從%$ q%更改爲'$ q%',現在它可以運行http://prntscr.com/22mxl,但不顯示菜單。 prntscr。COM/22mxg。如何解決這個問題?對於原始搜索.PHP它返回somtehing像這樣http://prntscr.com/22n0e並顯示http://prntscr.com/22n0r。請解釋一下這個筆畫的含義是什麼? $ results [] = array($ row [1] => $ row [0]); – 2011-06-16 16:08:45

+0

我已經做了上面的編輯。 – Josh 2011-06-16 16:27:20