與PHP的Jquery自動完成功能

我一直在搞這個太久，試圖讓它工作。任何人都可以請看看你是否有任何指針。與PHP的Jquery自動完成功能

<html> 
    <head> 
     <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> 
     <link type="text/css" rel="stylesheet" href="autocomplete.css" />  
     <script src="jquery-1.7.2.min.js" type="text/javascript"></script> 
     <script src="jquery-ui-1.8.21.custom.min.js" type="text/javascript"></script> 
     <title></title> 
    </head> 
    <body> 
     <style> 
      .ui-autocomplete-loading { background: white url('images/ui-anim_basic_16x16.gif') right center no-repeat; } 
     </style> 
     <script> 
      $(function() {     
       $("#materials").autocomplete({ 
        source: "autocomplete.php", 
        minLength: 2 
       }); 
      }); 
     </script> 
     <div class="demo"> 

      <div class="ui-widget"> 
       <label for="materials">Materials: </label> 
       <input id="materials" /> 
      </div> 
     </div><!-- End demo -->    
    </body> 
</html>

和PHP文件是

require_once "db_con.php"; // Database connection, I know this works. 
$q = strtolower($_GET["q"]); 
if (!$q) 
    return; 

$sql = "SELECT * FROM materials WHERE name LIKE '%$q%'"; 
$rsd = mysqli_query($dbc, $sql) or die(mysqli_error($dbc)); 
while ($rs = mysqli_fetch_array($rsd)) { 
    $cname = $rs['name']; // I know this all returns correctly 
    echo json_encode($cname); // First time I have ever used json, error might be here. 
}

我想有動力的jQuery自動完成是從MySQL使用PHP提供的數據的網頁。 Simples。只有它不工作...

任何人有任何想法我失蹤？

問候

---- ----編輯

爲了確認這是工作，我完成以下任務：

<!DOCTYPE html> 
<html> 
    <head> 
     <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> 
     <link type="text/css" rel="stylesheet" href="autocomplete.css" />  
     <script src="jquery-1.7.2.min.js" type="text/javascript"></script> 
     <script src="jquery-ui-1.8.21.custom.min.js" type="text/javascript"></script> 
     <title></title> 
    </head> 
    <body> 
     <style> 
      .ui-autocomplete-loading { background: white url('images/ui-anim_basic_16x16.gif') right center no-repeat; } 
     </style> 
     <script> 
      $(function() {     
       $("#materials").autocomplete({ 
        source: <?php 
include_once 'db_con.php'; 
$sql = "SELECT name FROM materials"; 
$rsd = mysqli_query($dbc, $sql) or die(mysqli_error($dbc)); 
echo '['; 
while ($rs = mysqli_fetch_array($rsd)) { 
    echo "'" . $rs['name'] . "', "; //add results to array 
} 
echo ']'; 
?>, 
         minLength: 2 
        }); 
       }); 
     </script> 
     <div class="demo"> 

      <div class="ui-widget"> 
       <label for="materials">Materials: </label> 
       <input id="materials" /> 
      </div> 


     </div><!-- End demo -->   
    </body> 
</html>

這完美的作品。那麼好INFACT我想我要保持這種代碼並沒有它應該如何工作的，但...

來源

2012-07-19 Paul Chambers

編輯是構建JSON字符串最可怕的方式。嘗試：'$ json = array（）; while（$ rs = mysqli_fetch_array（$ rsd））{$ json [] = $ rs ['name']; }回聲json_encode（$ json）;' – Sammaye 2012-07-19 09:23:56

你的PHP是完全錯誤的：

while ($rs = mysqli_fetch_array($rsd)) { 
    $cname = $rs['name']; // I know this all returns correctly 
    echo json_encode($cname); // First time I have ever used json, error might be here. 
}

應該是：

$cname = array(); 
while ($rs = mysqli_fetch_array($rsd)) { 
    $cname[]['label'] = $rs['name']; // I know this all returns correctly 
    break; 
} 
echo json_encode($cname); // First time I have ever used json, error might be here.

label是默認標籤字段在由jqueryautocomplete使用的數組行中（我相信）。此外，返回必須是每個數組行代表匹配的數組數組。

您可以通過執行使問題更加複雜通過添加值字段什麼使文本框實際上等於：

$cname = array(); 
while ($rs = mysqli_fetch_array($rsd)) { 
    $cname[]['label'] = $rs['name']; // I know this all returns correctly 
    $cname[]['value'] = $rs['id']; 
    break; 
} 
echo json_encode($cname); // First time I have ever used json, error might be here.

當然，我不認爲你實際上想要的break;我把這個因爲：

while ($rs = mysqli_fetch_array($rsd)) { 
    $cname = $rs['name']; // I know this all returns correctly 
    echo json_encode($cname); // First time I have ever used json, error might be here. 
}

表示你實際上從結果中返回一行。如果你不是，並且實際上是返回所有結果，那麼取出break;。

來源

2012-07-19 09:13:08 Sammaye

這個工作完美。感謝Sammaye。 – 2012-07-19 20:33:20

在PHP的一部分，也許嘗試類似的東西：

$res = array(); //create a new array 
while ($rs = mysqli_fetch_array($rsd)) { 
    $res[] = (string)$rs['name']; //add results to array, casted as string 
} 
header('Content-type: application/json'); //add JSON headers (might work w/o) 
echo json_encode($res); //output array as JSON

...這樣你應該在一個陣列中的所有結果像 ['name1', 'name2', 'name3']

來源

2012-07-19 08:46:24

我試過這個，但似乎沒有影響我的代碼。 – 2012-07-19 09:03:41

在JS部分嘗試'源代碼：['name1'，'name2'，'name3']'以確保jQuery部分有效。如果沒有，你是否在JS控制檯上發生任何錯誤？ – 2012-07-19 09:07:01

好主意謝謝。它適用於['name1'，'name2'，'name3']，所以我認爲它一定是PHP的結束。感謝這至少幫助我減少了50％的觀看位置。 – 2012-07-19 09:15:55

試試這個代碼，它的工作對我來說

$().ready(function() { 
$("#materials").autocomplete("autocomplete.php", { 
     width: 260, 
     matchContains: true, 
     autoFill:true, 
     selectFirst: false 
    }); 
});

來源

2012-07-19 08:48:52 Hkachhia

這似乎不適用於我。直到文本框甚至沒有像調用jquery函數那樣加載gif永遠不可見。 – 2012-07-19 09:03:21

您的文本框ID是否是材料？如果沒有，那麼應用ID材料並檢查它。 – Hkachhia 2012-07-19 09:05:50

@PaulChambers你也可以在ready（）函數中寫這個函數。我已經更新了我的答案檢查 – Hkachhia 2012-07-19 09:09:14

從PHP處理JSON答案Ajax調用我自定義源功能及處理結果我自己是這樣的：

$(function() {     
    $("#materials").autocomplete({ 
     source: function(request, response){ 
      $.post("autocomplete.php", { 
       term: request.term 
      }, function(data){ 
       if (data.length == 0) { 
        data.push({ 
         label: "No result found", 
        }); 
       } 
       response($.map(data, function(item){ 
        return { 
         label: item.name, 
         value: item.name 
        } 
       })) 
      }, "json"); 
     }, 
     minLength: 2, 
     dataType : "json"}); 
});

來源

2012-07-19 09:00:53 kawashita86

與PHP的Jquery自動完成功能

回答

相關問題