阿賈克斯：如何輸出數據的jQuery自動完成

Question

我試圖從這裏http://jqueryui.com/autocomplete/#default

使用jQuery的自動完成功能，但我的輸出不使用它。

Here's my FIDDLE.我不得不手動插入JSON到一個數組的jsfiddle不會允許外部數據庫的...

PHP：

<?php 
    include('../../dbconn.php'); 
    //-------------------------------------------------------------------------- 
    // Example php script for fetching data from mysql database 
    //-------------------------------------------------------------------------- 
    $databaseName = "accounting"; 
    $tableName = "generalTransactions"; 

    //-------------------------------------------------------------------------- 
    // 1) Connect to mysql database 
    //-------------------------------------------------------------------------- 

    $con = mysql_connect($gaSql['server'],$gaSql['user'],$gaSql['password']); 
    $dbs = mysql_select_db($databaseName, $con); 
    //-------------------------------------------------------------------------- 
    // 2) Query database for data 
    //-------------------------------------------------------------------------- 

    $result = mysql_query("SELECT * FROM $tableName ORDER BY `id` DESC LIMIT 1 ");   //query 
    $array = mysql_fetch_row($result);       //fetch result       
    //-------------------------------------------------------------------------- 
    // 3) echo result as json 
    //-------------------------------------------------------------------------- 
    echo json_encode($array); 

?> 

阿賈克斯小提琴：

$(function() { 
    var availableTags = [ 
     ["23","1500-0900","Profit On Sale Of Fixed Assets","Income Statement","Other Income","","","2013-07-26 10:22:07","Demo Admin"], 
     ["13","1500-0920","Profit On Sale Of Fixed Assets","Income Statement","Other Income","","","2013-07-23 13:42:45","Demo Admin"], 
     ["14","3100-1200","Other Assets 002 - Owned - Depreciation","Income Statement","Expenditure","Depreciation","","2013-07-23 13:47:06","Demo Admin"], 
     ["12","3200-1120","Other Assets 001 - Leased - Depreciation","Income Statement 3","Expenditure","Depreciation","","2013-07-23 13:48:42","Demo Admin"], 
     ["16","3300-0800","Bank Charges","Income Statement","Expenditure","","","2013-07-25 10:27:16","Demo Admin"], 
     ["15","3300-4100","Loss On Sale Of Fixed Assets","Income Statement","Expenditure","","","2013-07-25 10:27:08","Demo Admin"], 
     ["21","3300-5500","Rental - Premises","Income Statement","Expenditure","","","2013-07-25 10:27:53","Demo Admin"], 
     ["20","3300-6800","Transport And Freight","Income Statement","Expenditure","","","2013-07-25 10:27:47","Demo Admin"], 
     ["22","6500-5100","Goodwill - Impairment","Balance Sheet","Non-Current Assets","Goodwill","","2013-07-25 10:28:00","Demo Admin"], 
     ["17","7400-0100","Interbank Transfer","Balance Sheet","Current Assets","Cash And Cash Equivalents","","2013-07-25 10:27:22","Demo Admin"], 
     ["18","7400-0200","Bank Balance 001","Balance Sheet","Current Assets","Cash And Cash Equivalents","","2013-07-25 10:27:29","Demo Admin"], 
     ["19","9800-0100","Taxation - Normal","Balance Sheet","Current Liabilities","Taxation","","2013-07-25 10:27:40","Demo Admin"] 
    ]; 
    $("#account").autocomplete({ 
     source: availableTags 
    }); 
}); 

阿賈克斯在我的文件中：

$("#account").autocomplete({ 
    source: 'search.php' 
}); 

我不認爲我的輸出是正確的...

如果您有任何答案或建議，我會真的很感激它！

UPDATE：

使用新的輸出mysql_fetch_accoc

[{"id":"23","accountNumber":"1500-0900","accountDescription":"Profit On Sale Of Fixed Assets","accountLevel1":"Income Statement","accountLevel2":"Other Income","accountLevel3":"","accountLevel4":"","createdDate":"2013-07-26 10:22:07","createdUser":"Demo Admin"},{"id":"13","accountNumber":"1500-0920","accountDescription":"Profit On Sale Of Fixed Assets","accountLevel1":"Income Statement","accountLevel2":"Other Income","accountLevel3":"","accountLevel4":"","createdDate":"2013-07-23 13:42:45","createdUser":"Demo Admin"},{"id":"14","accountNumber":"3100-1200","accountDescription":"Other Assets 002 - Owned - Depreciation","accountLevel1":"Income Statement","accountLevel2":"Expenditure","accountLevel3":"Depreciation","accountLevel4":"","createdDate":"2013-07-23 13:47:06","createdUser":"Demo Admin"},{"id":"12","accountNumber":"3200-1120","accountDescription":"Other Assets 001 - Leased - Depreciation","accountLevel1":"Income Statement 3","accountLevel2":"Expenditure","accountLevel3":"Depreciation","accountLevel4":"","createdDate":"2013-07-23 13:48:42","createdUser":"Demo Admin"},{"id":"16","accountNumber":"3300-0800","accountDescription":"Bank Charges","accountLevel1":"Income Statement","accountLevel2":"Expenditure","accountLevel3":"","accountLevel4":"","createdDate":"2013-07-25 10:27:16","createdUser":"Demo Admin"},{"id":"15","accountNumber":"3300-4100","accountDescription":"Loss On Sale Of Fixed Assets","accountLevel1":"Income Statement","accountLevel2":"Expenditure","accountLevel3":"","accountLevel4":"","createdDate":"2013-07-25 10:27:08","createdUser":"Demo Admin"},{"id":"21","accountNumber":"3300-5500","accountDescription":"Rental - Premises","accountLevel1":"Income Statement","accountLevel2":"Expenditure","accountLevel3":"","accountLevel4":"","createdDate":"2013-07-25 10:27:53","createdUser":"Demo Admin"},{"id":"20","accountNumber":"3300-6800","accountDescription":"Transport And Freight","accountLevel1":"Income Statement","accountLevel2":"Expenditure","accountLevel3":"","accountLevel4":"","createdDate":"2013-07-25 10:27:47","createdUser":"Demo Admin"},{"id":"22","accountNumber":"6500-5100","accountDescription":"Goodwill - Impairment","accountLevel1":"Balance Sheet","accountLevel2":"Non-Current Assets","accountLevel3":"Goodwill","accountLevel4":"","createdDate":"2013-07-25 10:28:00","createdUser":"Demo Admin"},{"id":"17","accountNumber":"7400-0100","accountDescription":"Interbank Transfer","accountLevel1":"Balance Sheet","accountLevel2":"Current Assets","accountLevel3":"Cash And Cash Equivalents","accountLevel4":"","createdDate":"2013-07-25 10:27:22","createdUser":"Demo Admin"},{"id":"18","accountNumber":"7400-0200","accountDescription":"Bank Balance 001","accountLevel1":"Balance Sheet","accountLevel2":"Current Assets","accountLevel3":"Cash And Cash Equivalents","accountLevel4":"","createdDate":"2013-07-25 10:27:29","createdUser":"Demo Admin"},{"id":"19","accountNumber":"9800-0100","accountDescription":"Taxation - Normal","accountLevel1":"Balance Sheet","accountLevel2":"Current Liabilities","accountLevel3":"Taxation","accountLevel4":"","createdDate":"2013-07-25 10:27:40","createdUser":"Demo Admin"}] 

編輯：

[{"id":"23","accountNumber":"1500-0900","accountDescription":"Profit On Sale Of Fixed Assets","accountLevel1":"Income Statement","accountLevel2":"Other Income","accountLevel3":"","accountLevel4":"","createdDate":"2013-07-26 10:22:07","createdUser":"Demo Admin","label":"1500-0900","value":"23"}] 

Answer 1

你可以看一下這兩種方式：

a）您的輸出需要進行處理，以便查找自動完成腳本需要顯示的內容; 或 b）您可以修改自動完成選項頂部的search.php腳本的響應使其工作。

無論哪種方式，search.php的回覆都需要是關聯數組，因此請將mysql_fetch_row更改爲mysql_fetch_assoc。我們將使用第一種方式{a}並使其變得美妙！

現在，讓我們看看自動完成腳本需要什麼才能工作。您正在迴歸似乎是對象的數組：

var AvailableTags = 
{"id":"23","accountNumber":"1500-0900","accountDescription":"Profit On Sale Of Fixed Assets","accountLevel1":"Income Statement","accountLevel2":"Other Income","accountLevel3":"","accountLevel4":"","createdDate":"2013-07-26 10:22:07","createdUser":"Demo Admin"} 
{"id":"13","accountNumber":"1500-0920","accountDescription":"Profit On Sale Of Fixed Assets","accountLevel1":"Income Statement","accountLevel2":"Other Income","accountLevel3":"","accountLevel4":"","createdDate":"2013-07-23 13:42:45","createdUser":"Demo Admin"} 
{"id":"14","accountNumber":"3100-1200","accountDescription":"Other Assets 002 - Owned - Depreciation","accountLevel1":"Income Statement","accountLevel2":"Expenditure","accountLevel3":"Depreciation","accountLevel4":"","createdDate":"2013-07-23 13:47:06","createdUser":"Demo Admin"} 
{"id":"12","accountNumber":"3200-1120","accountDescription":"Other Assets 001 - Leased - Depreciation","accountLevel1":"Income Statement 3","accountLevel2":"Expenditure","accountLevel3":"Depreciation","accountLevel4":"","createdDate":"2013-07-23 13:48:42","createdUser":"Demo Admin"} 
{"id":"16","accountNumber":"3300-0800","accountDescription":"Bank Charges","accountLevel1":"Income Statement","accountLevel2":"Expenditure","accountLevel3":"","accountLevel4":"","createdDate":"2013-07-25 10:27:16","createdUser":"Demo Admin"} 
{"id":"15","accountNumber":"3300-4100","accountDescription":"Loss On Sale Of Fixed Assets","accountLevel1":"Income Statement","accountLevel2":"Expenditure","accountLevel3":"","accountLevel4":"","createdDate":"2013-07-25 10:27:08","createdUser":"Demo Admin"} 
... 
{"id":"19","accountNumber":"9800-0100","accountDescription":"Taxation - Normal","accountLevel1":"Balance Sheet","accountLevel2":"Current Liabilities","accountLevel3":"Taxation","accountLevel4":"","createdDate":"2013-07-25 10:27:40","createdUser":"Demo Admin"}] 

Unfortnately，這些對象缺少兩個關鍵標識符告訴自動完成腳本如何正確地使用它們。 項目和值鍵。這些鍵指示自動完成功能的哪些部分顯示在輸入框中，以及哪些部分用作該選擇的值。例如，在你的例子中（下面），我們將需要分配返回對象的兩個元素：一個項目項和一個值鍵 - 一對這些對你的返回數組中的每個對象。

$("#account").autocomplete({ 
    source: 'search.php' 
}) 

jsFiddle DEMO（幾乎就在那裏！）