jQuery AutoComplete Array Füllen

Ich versuche zu verwenden die jQuery-autocomplete-Funktion, und nach dem Lesen mehrerer Beiträge habe ich noch zwei Fragen:

1) ich habe AutoVervollständigen arbeiten mit dem code gepostet am Boden, aber ich brauche das array mit dem Titel "Daten" gefüllt werden aus unserer Datenbank. Ich habe versucht, verschiedene Methoden verwenden, um zu füllen diese per AJAX. Ich habe versucht, mit $.get und $.ajax. Was ist die korrekte syntax, um dies zu erreichen?

2) Dieses array wird groß sein, ich habe 60.000 plus Werten, wenn ich füllen Sie einfach das array einmal. Ich Frage mich, ob es möglich ist, um eine AJAX-Anfrage füllen Sie das array jedes mal, wenn der Benutzer eingibt einen neuen Brief? Ist dies besser zu tun, oder füllen Sie das array mit allen Werten auf einmal? Besser, die Steuern, die das system weniger?

//This code works
<script type="text/javascript">
  $(document).ready(function(){
  var data = "Facebook Gowalla Foursquare".split(" ");
  $("#search_company").autocomplete(data);
  });
</script>


//display company live search
echo('<form id="form" method="post" action="competitor_unlink.php" onsubmit="return">');
echo('Company: <input id="search_company"/>');
echo('<br/>');
echo('<button type="submit" value="Submit">Submit</button>');
echo('</form>');

InformationsquelleAutor user387049 | 2010-12-14

2

Blick auf diese demo - es ist, was Sie tun möchten (die Daten über ajax):

http://jqueryui.com/demos/autocomplete/#remote

Können Sie ziehen Daten aus einer lokalen
und/oder einer remote-Quelle: Lokal ist gut
für kleine Datenbestände (wie z.B. eine Adresse
Buch mit 50 Einträge), remote
notwendig für big-data-sets, wie eine
Datenbank mit Hunderten oder Millionen von
Einträge zur Auswahl.

AutoVervollständigen können angepasst werden, um zu arbeiten
mit verschiedenen Daten-Quellen, indem Sie einfach
die Angabe der source-option. Eine Daten -
Quelle:

kann ein Array mit lokalen Daten einen String,
die Angabe einer URL ein Callback Der lokalen
Daten können ein einfaches Array von Strings,
oder es enthält Objekte für jedes Element
in das array entweder mit einem Etikett oder
value-Eigenschaft, oder beides. Das label
angezeigte Eigenschaft wird in der
Vorschlag Menü. Der Wert wird
eingefügt in das input-element nach
der Benutzer etwas ausgewählt aus der
Menü. Wenn nur eine Eigenschaft ist
angegeben ist, wird es für beide verwendet werden,
zB. wenn Sie nur
Wert-Eigenschaften, wird der Wert auch
verwendet werden, wie das label.

Wenn eine Zeichenfolge verwendet wird, die
Autocomplete plugin erwartet, dass
string auf eine URL-Ressource, die
zurück JSON-Daten. Es kann auf
dem gleichen host oder auf einem anderen
(muss JSONP). Die Anfrage
parameter "Laufzeit" Hinzugefügt wird, dass
URL. Die Daten selbst werden in der
gleiche format wie die lokalen Daten
oben beschrieben.

Die Dritte Variante, der Rückruf,
bietet die größte Flexibilität und kann
wird eine Verbindung zu jeder beliebigen Datenquelle zu
AutoVervollständigen. Der callback bekommt zwei
Argumente:

1) Ein request-Objekt mit einer einzigen,
Eigenschaft, die man als "Begriff", die sich
zu dem Wert, der derzeit in den text
input. Zum Beispiel, wenn der Benutzer
eingegeben "new yo" in einer Stadt, Feld, die
Autocomplete Begriff wird gleich von "new yo".

2) Eine Antwort Rückruf erwartet
ein einziges argument, die Daten enthalten
zu empfehlen für den Benutzer. Diese Daten
sollten gefiltert werden basierend auf den
sofern Begriff, und können sich in einem von
die oben beschriebenen Formate für die einfache
lokale Daten (String-Array oder
Objekt-Array mit label/Wert/beide
Eigenschaften). Es ist wichtig, wenn
bereitstellen einer benutzerdefinierten Quelle Rückruf
behandeln von Fehlern bei der Anfrage. Sie
muss immer rufen die callback-Antwort
auch wenn Sie auf einen Fehler stoßen. Diese
sorgt dafür, dass das widget immer die
korrekten Zustand.
- Ich habe versucht, nach den Anweisungen auf der website, aber ich bin noch nicht in der Lage, um es an die Arbeit. Es sieht aus wie das php-Skript versuche ich den Zugriff über eine AJAX-get-request nicht auch ran. Aber ich habe getan, viele AJAX-get-requests, bevor diese. Irgendwelche Ideen?
InformationsquelleAutor Jakub Konecki

Hier ist ein Beispiel, wie man eine URL angeben, die wird wieder die Ergebnisse aus der Datenbank als JSON unter Verwendung der jQuery-UI-autocomplete-plugin.

$("#search_company").autocomplete({
    source: "/Search", //<-- URL of the page you want to do the processing server-side
    minLength: 4 //<-- don't try to run the search until the user enters at least 4 chars
});

Autocomplete wird automatisch fügen Sie ein querystring-parameter mit der Bezeichnung "Begriff" an die URL, so dass Ihre Suche Seite müssen damit rechnen, dass. Nicht sicher, was server-Technologie, die Sie verwenden, aber da bin ich eine .NET Entwickler hier ist ein Beispiel in ASP.NET MVC 🙂

public ActionResult Search(string term) {
    var results = db.Search(term); //<-- this is where you query your DB
    var jqItems = new List<jQueryUIAutoCompleteItem>();
    foreach (var item in results) {
        jqItems.Add(new jQueryUIAutoCompleteItem() {
            value = item.CompanyId.ToString(),
            id = item.CompanyId.ToString(),
            label = item.CompanyName
        });
    }
    return Json(jqItems.ToArray(), JsonRequestBehavior.AllowGet);
}

jQueryUIAutoCompleteItem ist nur ein Daten-container mit dem JSON-format, dass die autocomplete-plugin erwartet.

public class jQueryUIAutoCompleteItem {
    public string value { get; set; }
    public string label { get; set; }
    public string id { get; set; }
}

InformationsquelleAutor Nick Patterson

1

Ist richtig, dass die Zusendung der ganze 60.000,-und record-Liste auf dem client-Rechner klingt nicht nach der besten Lösung. Sie werden bemerken, dass Google zeigt Ihnen nur eine Handvoll der beliebtesten Spiele in seiner autocomplete, wie auf vielen anderen websites.

Könnte man kürzen Sie die Liste, indem er wartet, bis der Benutzer geben Sie zwei oder drei Buchstaben, anstatt die Suche auf dem ersten.

Könnten Sie tun, Seite chunking in der Liste (es geht durch verschiedene Namen). Das heißt, nur die top 10 oder 15 Spiele. Der Benutzer kann Holen Sie mehr der Liste durch scrollen oder durch klicken auf "Zeige Weitere Ergebnisse" link. Sie haben zu schreiben (oder suchen) den javascript-code für dieses, natürlich.
- also, was wäre der beste Weg, um füllen Sie dieses array werden? onkeyup rufen Sie die javascript-Funktion oben beschrieben? (öbv ändern Sie es von onready)
InformationsquelleAutor DOK
0

Vielleicht ist es ein bisschen spät zu diesem post, aber für andere, die ihn finden. Erstellt habe ich ein plugin für jquery und jqueryui AutoVervollständigen-Steuerelement, das funktioniert mit Foursquare. Lesen Sie den Beitrag und laden Sie das plugin auf Foursquare Autocomplete Plugin

InformationsquelleAutor Joseph Guadagno

Schreibe einen Kommentar

Du musst angemeldet sein, um einen Kommentar abzugeben.