JQuery UI zur automatischen Vervollständigung mit Ajax PHP MYSQL nicht angezeigt Ergebnis

Question

I JQuery Ui autocomplete Funktion anzuzeigen Inhalte aus dem database mit dem Code unten

Script

<script> 
$(function() { 
$("#query").autocomplete({ 
    source: 'search.php' 
}); 
}); 
</script> 

HTML

<div class="col-md-9 col-sm-8 col-xs-8 " > 
    <input style="width:100%;"class="form-control" id="query" placeholder="Search" type="text">  
</div> 

umgesetzt haben

Wenn ich oben laufe, bekomme ich th e folgendes Ergebnis innerhalb span notification

<span role="status" aria-live="assertive" aria-relevant="additions" class="ui-helper-hidden-accessible"> 
<div style="display: none;"> 
3 results are available, use up and down arrow keys to navigate.</div> 
<div style="display: none;"> 
4 results are available, use up and down arrow keys to navigate.</div> 
<div>4 results are available, use up and down arrow keys to navigate.</div></span> 

Aber die zur automatischen Vervollständigung UL>li eingereicht Keinerlei Wert nicht halten

<ul class="ui-autocomplete ui-front ui-menu ui-widget ui-widget-content" id="ui-id-1" tabindex="0" style="display: none; top: 902.452px; left: 72.7257px; width: 372px;"> 
<li class="ui-widget-content ui-menu-divider"></li> 
<li class="ui-widget-content ui-menu-divider"></li> 
<li class="ui-widget-content ui-menu-divider"></li> 
<li class="ui-widget-content ui-menu-divider"></li> 
</ul> 

Dies ist, was

zu sehen

Ich bin in der Lage Und hier ist das Ergebnis, das ich bekomme chrome ->Network

Answer 1

Wie @Marmeladze vorgeschlagen, ist Ihr Problem wahrscheinlich das Antwortformat des PHP-Codes. Nach https://jqueryui.com/autocomplete/ sollten Sie ein einfaches Array wie dieses:

[ 
    "ActionScript", 
    "AppleScript", 
    "Asp", 
    "BASIC", 
    "C", 
    "C++" 
]; 

nach http://api.jqueryui.com/autocomplete/ Mehrere Typen werden unterstützt:

Array: Ein Array kann für lokale Daten verwendet werden. Es gibt zwei unterstützte Formate: Ein Array von Strings: ["Choice1", "Choice2"] Ein Array von Objekten mit Label- und Werteigenschaften: [{label: "Choice1", value: "value1"}, .. .] Die Etiketteneigenschaft wird im Vorschlagsmenü angezeigt. Der Wert wird in das Eingabeelement eingefügt, wenn ein Benutzer ein Element auswählt. Wenn nur eine Eigenschaft angegeben ist, wird diese für beide verwendet, z. B. wenn Sie nur Werteigenschaften angeben, wird der Wert auch als bezeichnet.

Ein anderes Beispiel mit Remote-Server (https://jqueryui.com/autocomplete/#remote):

[ 
    {"id":"Nycticorax nycticorax", 
    "label":"Black-crowned Night Heron", 
    "value":"Black-crowned Night Heron"}, 
    {"id":"Corvus cornix", 
    "label":"Hooded Crow", 
    "value":"Hooded Crow"} 
]