jQuery UI自動完成與Json不顯示建議

Question

我遇到一些來自jQueryUi的自動完成組件的麻煩。沒有出現帶有自動填充建議的列表。

我測試了以下代碼（來自jQuery UI），儘管servlet發送JSON對象，「數據」變量正在講故事，但組件仍未顯示建議​​列表。

此外我嘗試了一個簡單的組件列表作爲源（like here），它工作正常。

你有什麼想法會發生什麼？

<script> 
$(function() { 
     var cache = {}; 
      $("#bear").autocomplete({ 
       minLength: 2, 
       source: function(request, response) { 

       var term = request.term;     
       if (term in cache) { 
        response(cache[ term ]); 
        return; 
       } 

       $.getJSON("/animals/MaintainMamals?operation=14", request, function(data, status, xhr) { 
        cache[ term ] = data; 
        response(data); 
       }); 

       } 
      }); 
      }); 
</script> 

<form> 
    <div class="ui-widget"> 
     <label for="bear">Bear name (type a piece of name): </label> 
     <input id="bear" name="bear" class="text ui-widget-content ui-corner-all"/> 
    </div> 
</form> 

在測試中使用

JSON對象（我試着用一個簡單的JSON的東西只是一個字符串指的「名稱」屬性建，用相同的[衰]結果）：

[ 
    { 
    "id": 1234567, 
    "name": "Yogi Bear", 
    "activity": { 
     "handler": { 
     "interfaces": [ 
      {} 
     ], 
     "constructed": true, 
     "persistentClass": {}, 
     "getIdentifierMethod": { 
      "clazz": {}, 
      "slot": 2, 
      "name": "getCod", 
      "returnType": {}, 
      "parameterTypes": [], 
      "exceptionTypes": [], 
      "modifiers": 1, 
      "root": { 
      "clazz": {}, 
      "slot": 2, 
      "name": "getId", 
      "returnType": {}, 
      "parameterTypes": [], 
      "exceptionTypes": [], 
      "modifiers": 1, 
      "override": false 
      }, 
      "override": false 
     }, 
     "setIdentifierMethod": { 
      "clazz": {}, 
      "slot": 3, 
      "name": "setId", 
      "returnType": {}, 
      "parameterTypes": [ 
      {} 
      ], 
      "exceptionTypes": [], 
      "modifiers": 1, 
      "root": { 
      "clazz": {}, 
      "slot": 3, 
      "name": "setId", 
      "returnType": {}, 
      "parameterTypes": [ 
       {} 
      ], 
      "exceptionTypes": [], 
      "modifiers": 1, 
      "override": false 
      }, 
      "override": false 
     }, 
     "overridesEquals": false, 
     "entityName": "com.zoo.Activity", 
     "id": 7105, 
     "initialized": false, 
     "readOnly": false, 
     "unwrap": false 
     } 
    } 
    } 
] 

Answer 1

的自動填充小部件會期望您陣列中的每個項目都具有屬性，或屬性，或屬性。由於您的數據沒有任何，您可以：

1. 調整你的服務器端的數據源，以返回滿足該條件的項目，或
2. 從你的服務器端代碼相匹配的標準轉換數據在您提出請求後。

我只能提供一個答案，＃2，因爲我沒有看到你的服務器端代碼，所以這裏是你會怎麼做：

$(function() { 
    var cache = {}; 

    $("#bear").autocomplete({ 
     minLength: 2, 
     source: function(request, response) { 
      var term = request.term;     
      if (term in cache) { 
       response(cache[ term ]); 
       return; 
      } 

      $.getJSON("/animals/MaintainMamals?operation=14", request, function (data, status, xhr) { 
       /* Add a `label` property to each item */ 
       $.each(data, function (_, item) { 
        item.label = item.name; 
       }); 

       cache[term] = data; 
       response(data); 
      }); 
     } 
    }); 
}); 

Here's an example是假貨的AJAX request--除此之外它應該與你的情況相似。