JQuery Autocomplete eine leere Liste

Question

Edit 2 zeigt: noch besser, mehrere Werte arbeitet

Eigentlich hat man einfach einen „Wert“ Feld zu geben, die das Feld ausfüllt. Keine Notwendigkeit für das Feld "ID/Label", aber Wertfeld ist erforderlich. Dies funktioniert:

foreach ($queries as $query) 
     { 
      $results[] = [ 
      'zip' => $query->zip, 
      'value' => $query->commune, 
      'libelle' => $query->libelle, 
      'lieudit' => $query->lieudit 
      ]; 
     } 
return Response::json($results); 

---

Edit: hier ist die Lösung, dank Adyson Antwort

Das Skript sollte

Ein Array von Objekten formatiert und wiederkehr JSon werden mit label und value Eigenschaften:

[ { label: "Choice1", value: "value1" }, ... ]

(jQuery API documentation)

Also, Modifizieren des PHP-Skript wie folgt funktioniert:

foreach ($queries as $query) 
     { 
      $results[] = [ 
      'id' => $query->zip, 
      'value' => $query->commune, 
      ]; 
     } 
return Response::json($results); 

---

Original Frage

mit JQuery Autocomplete, eine Abfrage Skript.

Die Liste zeigt, wie viele Zeilen, wie es Ergebnisse (wenn ich mein Skript gesetzt X Ergebnisse zurückgeben, gibt es Reihen X als auch in der Liste):

Aber es doesn‘ t Füllen Sie die Zeilen mit den Daten. Was könnte dort schief gegangen sein?

---

Die Daten zurückgegeben wird, einige json:

Request URL:http://localhost:8000/search/autocomplete?term=750 
Request Method:GET 
Status Code:200 OK 
Remote Address:127.0.0.1:8000 
Response Headers 
view source 
Cache-Control:no-cache 
Connection:close 
Content-Type:application/json 
Date:Tue, 15 Nov 2016 14:53:07 GMT 
Host:localhost:8000 

Und hier sind die Daten:

$(function(){ 
    $("#fromzip").autocomplete({ 
     source: "/search/autocomplete", 
     dataType: 'json', 
     minLength: 3, 
    }); 
    }); 

Die HTML:

[{"zip":"75004","commune":"PARIS 04","libelle":"PARIS","lieudit":""}, 
{"zip":"75005","commune":"PARIS 05","libelle":"PARIS","lieudit":""}, 
{"zip":"75003","commune":"PARIS 03","libelle":"PARIS","lieudit":""}, 
{"zip":"75006","commune":"PARIS 06","libelle":"PARIS","lieudit":""}, 
{"zip":"75008","commune":"PARIS 08","libelle":"PARIS","lieudit":""}, 
{"zip":"75012","commune":"PARIS 12","libelle":"PARIS","lieudit":""}, 
{"zip":"75015","commune":"PARIS 15","libelle":"PARIS","lieudit":""}, 
{"zip":"75016","commune":"PARIS 16","libelle":"PARIS","lieudit":""}, 
{"zip":"75017","commune":"PARIS 17","libelle":"PARIS","lieudit":""}, 
{"zip":"75010","commune":"PARIS 10","libelle":"PARIS","lieudit":""}, 
{"zip":"75018","commune":"PARIS 18","libelle":"PARIS","lieudit":""}, 
{"zip":"75001","commune":"PARIS 01","libelle":"PARIS","lieudit":""}, 
{"zip":"75009","commune":"PARIS 09","libelle":"PARIS","lieudit":""}, 
{"zip":"75014","commune":"PARIS 14","libelle":"PARIS","lieudit":""}, 
{"zip":"75002","commune":"PARIS 02","libelle":"PARIS","lieudit":""}, 
{"zip":"75007","commune":"PARIS 07","libelle":"PARIS","lieudit":""}, 
{"zip":"75011","commune":"PARIS 11","libelle":"PARIS","lieudit":""}, 
{"zip":"75013","commune":"PARIS 13","libelle":"PARIS","lieudit":""}, 
{"zip":"75019","commune":"PARIS 19","libelle":"PARIS","lieudit":""}, 
{"zip":"75020","commune":"PARIS 20","libelle":"PARIS","lieudit":""}] 

Hier meine JS ist:

<input 
     id="fromzip" 
     name="fromzip" 
     type="text" 
     class="form-control" 
     placeholder="69003" 
     pattern=".{5}" 
     title="5 numbers zip" 
     maxlength="5" 
     required > 

Und die PHP (Laravel Input, DB und Response-Fassaden):

public function autocomplete(){ 
     $term = Input::get('term'); 
     $results = array(); 

     $queries = DB::table('zips') 
      ->where('zip', 'LIKE', $term.'%') 
      ->orWhere('libelle', 'LIKE', $term.'%') 
      ->take(30)->get(); 

     foreach ($queries as $query) 
     { 
      $results[] = [ 'zip' => $query->zip, 
      'commune' => $query->commune, 
      'libelle' => $query->libelle, 
      'lieudit' => $query->lieudit]; 
     } 

     return Response::json($results); 

     } 

Answer 1

Werfen Sie einen Blick auf http://api.jqueryui.com/autocomplete/#option-source. Darin heißt es, dass die Daten in dem Format nicht eine dieser beiden Eigenschaften (Label oder Wert) haben muss

[ { label: "Choice1", value: "value1" }, ... ] 

Ihre Beispieldatenelemente.

Sie können Ihr serverseitiges Skript ändern, um das richtige Format auszugeben, oder wenn Sie dies nicht tun/können, können Sie die Funktion source-as-a-function im Plugin verwenden, um eine Funktion zu schreiben das transformiert die Daten.