Morgen,

ich versuche das jQuery-Plugin Autocomplete zu integrieren, leider funktioniert es noch nicht. Hier den Code:

Code :

1 2 3 4 5 6 7

$('#input').autocomplete(function(term) {         var searchUrl = urlBase + 'tagging/autocomplete/?term=' + term;       $.getJSON(searchUrl, function(jsonData) {         test = jsonData;             console.log(test);         });     });

Die Ausgabe von console.log lautet z.B.:

Code :

1	["EBE", "EBE1", "EBE2"]

Diese Daten werden über PHP mittels

Code :

1	echo json_encode($words);

ausgegeben. Allerdings wird mir nichts vorgeschlagen. Kann es daran liegen, dass die Daten nicht in der Form

Code :

1	{"0" : "EBE", "1" : "EBE1", "2" : "EBE2"}

da liegen?

Moin,

Der Autocompleter erwartet als 1. Argument entweder einen Array(so, wie du es in deinem Posting notiert hast), oder aber eine URL(das, was du brauchst.)

Du hast jedoch keines von Beidem, sondern eine Funktion ohne Rückgabewert.

Du musst also als 1. Argument nur die URL notieren.

Als Rückgabe wird kein JSON benötigt, sondern eine zeilenweise Auflistung der Einträge, wobei du dort getrennt durch ein | 2. Werte übermitteln kannst:

Der 1. ist in jedem Fall das, was in das Input übernommen wird(abgesehen von HTML-Tags zur Formatierung in der Dropdown-Liste)
Der 2. ist optional, dort kannst du einen value angeben, jener ist es, der beim Senden für das Input-Feld übertragen wird.

Wie so eine erwartete Rückgabe aussehen muss, kannst du hier sehen:
http://jquery.bassistance.de/autocom...p?q=n&limit=10
(in den Quelltext schauen....da steht alles Zeile für Zeile).

Zugegeben...das ist nicht wirklich gut dokumentiert, was dort erwartet wird, und json wäre in der Tat etwas zeitgemässer

Es bestände auch die Möglichkeit, über einen eigenen Callback-Handler bspw. JSON zu Verarbeiten, soweit ich dort gelesen habe.

Hm ich habs auch so eingebaut wie es im JQuery Kochbuch steht (mal davon abgesehen dass O'Reilly keinen wirklich brauchbaren Hinweis zum Aufbau der PHP Datei gibt, hab ichs der Logik nachempfunden und eine Abfrage gestrickt). Das Lokale Array führt zum Erfolg wohingegen eine Source URL keine Ausgabe liefert. Auch der String den Du im Beispiel nennst scheint die Funktion nicht zu interessieren...

Code :

1 2 3

$("input[name=receiver]").autocomplete({        source: "http://jquery.bassistance.de/autocomplete/demo/search.php"     });

Die Abfrage:

Code :

1	_getReceiver.php?q=mi

Liefert folgendes Ergebnis:

Code :

1 2	michaela|michaela miranda|miranda

Leider brachte auch dieser Beitrag keine Hilfe:
http://www.pengoworks.com/workshop/j...plete_docs.txt

Ideen ?

...wohingegen eine Source URL keine Ausgabe liefert...source: "http://jquery.bassistance.de/autocomplete/demo/search.php"

Hinter autocomplete verbirgt sich im Endeffekt auch nur Ajax und diesem ist es nicht gestattet cross-Domain content zu laden.
Stichwort: Same origin Policy

O'Reilly keinen wirklich brauchbaren Hinweis zum Aufbau der PHP Datei gibt

Da gibts auch nicht viel zu beachten.
Die PHP-Datei nimmt einen Get-Parameter entgegen und durchsucht dann ein Array / Mysql / oder sonstwas und liefert die passenden Ergebnise zurück. Wichtig ist dabei nur das am Ende Jedes Ergebnis in einer eigenen Zeile steht.

Hallo,

ich weiss - ich habe aber leider auch mit der lokalen URL keinen Erfolg.

Code :

1 2 3

$("input[name=receiver]").autocomplete({        source:"content/_getReceiver.php"     });

PHP-Datei:

PHP-Code:

while($row = mysql_fetch_assoc($res)){
                    echo $row['value_1']."|".$row['value_2']."\n";
                } 


Es geht leider nicht...
Hat jemand eine Idee?

By the way: In der Doku zur Methode steht dass sie den Rückgabewert als JSON erwartet - auch wenn mein Büchlein etwas anderes behauptet...

Liebe Grüße,

Mike

By the way: In der Doku zur Methode steht dass sie den Rückgabewert als JSON erwartet - auch wenn mein Büchlein etwas anderes behauptet...

Wo hast du das denn gelesen? Reden wir von dem selben autocomplete script?!

Nein ich spreche vom JQuery UI Autocomplete
http://docs.jquery.com/UI/Autocomplete

Any Ideas?

Moin,

evtl. habe ich etwas überlesen, aber eingangs beschäftigte sich dieses Thema halt mit
http://bassistance.de/jquery-plugins...-autocomplete/

du aber verwendest http://docs.jquery.com/UI/Autocomplete

Das sind verschiedene Baustellen.
Das von dir verwendete Plugin erwartet die Daten in Array-Form, das hast du schon korrekt festgestellt,...du lieferst die Daten aber nicht in dieser Form, denn dies:

PHP-Code:

while($row = mysql_fetch_assoc($res)){
                    echo $row['value_1']."|".$row['value_2']."\n";
                } 


...erzeugt Zweifels ohne die Daten in dem Format, wie es das Plugin von bassistance.de erfordert.

Hm das hatte ich befürchtet...
Mit JSON bin ich leider Null vertraut...
Doof nur dass das JQuery Kochbuch (bzw. sein Autor) auf Seite 256 behauptet es seie eine einfache Source Angabe als String möglich und nichts weiter - doch dem scheint wohl leider nicht so zu sein.

Für alle die also mit dem Jquery UI Autocomplete arbeiten möchten und auch festhängen habe ich diese lange Lösung:
http://net.tutsplus.com/tutorials/ja...mplete-widget/

Wenn jemand doch einen wirklich einfachen Weg kennt der keinen großen Aufwand erfordert bin ich ganz Ohr.

Hier nochmal der Verweis zur Doku:
http://docs.jquery.com/UI/Autocomplete

Es sind da diverse Sachen möglich.

Zitat von http://docs.jquery.com/UI/Autocomplete

* an Array with local data
* a String, specifying a URL
* a Callback

The local data can be a simple Array of Strings, or it contains Objects for each item in the array, with either a label or value property or both. The label property is displayed in the suggestion menu. The value will be inserted into the input element after the user selected something from the menu. If just one property is specified, it will be used for both, eg. if you provide only value-properties, the value will also be used as the label.

When a String is used, the Autocomplete plugin expects that string to point to a URL resource that will return JSON data. It can be on the same host or on a different one (must provide JSONP). The request parameter "term" gets added to that URL. The data itself can be in the same format as the local data described above.

The third variation, the callback, provides the most flexibility, and can be used to connect any data source to Autocomplete. The callback gets two arguments:

JSON ist halb so kompliziert.
Da du ja mit PHP arbeitest, brauchst du dort nur einen Array mit allen Strings erstellen, und ihn JSON-kodiert ausgeben. Dies geht sehr bequem per json_encode();

PHP-Code:

$strings=array('foo','bar','foobar');
die(json_encode($strings)); 


Hi,

ja soweit war ich schon:

PHP-Code:

echo json_encode($row['value'])."\n"; 


Auch mit oder ohne Komma - hat beides leider auch nicht funktioniert.
Das Buch sagt:
..."Als Antwort erwartet das Plugin eine Liste mit durch Zeilenumbruch getrennten Werten..."...

Jetzt lass uns das Ding mal ans laufen bringen - kann doch nicht sein dass es seit 2 Tagen nicht klappt . Bin drauf und dran ein Kopfgeld auf die funktionierende Version auszusetzen ...

1. Schmeisse dein Buch weg, die aktuellste Beschreibung findest du auf jquery.com
2. du sollst nicht jeden einzelnen Wert JSON-kodieren, sondern alle Werte in einem PHP-Array ablegen und diesen dann zum Schluss per json_encode() ausgeben

Das Buch ist super - auch wenns dem schnellen Entwicklungsprozess von JQuery UI nicht standhalten kann sind die anderen Dinge sehr wohl brauchbar - ich empfehle es jedem der mit JQuery arbeiten möchte und wie ich auch den haptischen Aspekt beim lesen eines Buches wichtig findet - soviel dazu ...

Ja - habe ich auch versucht:

PHP-Code:

$array = array();
while($row = mysql_fetch_assoc($res)){
                    $array[] = $row['value'];
                }
                echo json_encode($array); 


So wird das array korrekt dargestellt:
["michaela","miranda"] beim Aufruf: _getReceiver.php?q=mi
Allerdings funktioniert es immer noch nicht...

Code :

1 2 3 4 5

$("input[name=receiver]").autocomplete({        source: "content/_getReceiver.php",        minLength: 2,        delay: 0     });

... so schaut der JQuery Code aus...

Ich hab mal bei deinem Beitrag auf "zitieren" geklickt, und siehe, da erscheint das Problem

Zitat von SonMiko

So wird das array korrekt dargestellt:
["michaela","miranda"] beim Aufruf: _getReceiver.php?q=mi

Das rot markierte dort, das ist eine BOM.
Man sieht sie nicht, sie ist aber da, und verursacht den Fehler

Lösung: Speichere die _getReceiver.php ohne BOM(solltest du in deinem Editor einstellen können)

Jetzt verstehe ich nichts mehr - hab kaum verstanden was ein BOM sein soll (http://de.wikipedia.org/wiki/Byte_Order_Mark).

Wenn du dir sicher bist, dann bitte schreib einmal auf wie es aussehen soll bevor wir den Beitrag auf 5 Seiten verlängern müssen und die Datenbank ärgern - das wäre super hilfreich.

Was soll ich nun tun? Einen header setzen und eine Kodierung vorgeben? Und bitte was soll nun dieser BOM sein? Aus der Wikipedia Definition werde ich nicht wirklich schlau.

(Ich bin sicher wenn wir das Problem hier mit Lösung ausschreiben, werden andere Menschen die durch Google oder die Forensuche auf diesen Thread aufmerksam werden, auch zufrieden sein wenn sie beispielsweise dasselbe Problem haben).

Für alle die auch nicht wissen was ein BOM ist:

Als Byte Order Mark (BOM, dt. „Bytereihenfolge-Markierung“) wird das Unicode-Zeichen U+FEFF (zero-width non-breaking space) am Anfang eines Datenstroms bezeichnet, wo es als Signatur zur Definition der Byte-Reihenfolge und Kodierungsform in UCS/Unicode-Zeichenketten verwendet wird. http://de.wikipedia.org/wiki/Byte_Order_Mark

Und wie wird man es los ?

Liebe Grüße