jQuery UI-Autocomplete mit Mehreren Werten aus einer Datenbank

Ich versuche, den code zu modifizieren gefunden bei http://jqueryui.com/demos/autocomplete/#multiple zu verwenden generierten Daten aus meiner Datenbank, anstatt die Daten aus der Liste

 
$(function() { 
var availableTags = [ 
"ActionScript", 
"AppleScript", 
"Asp", 
"BASIC", 
"C", 
"C++", 
"Clojure", 
"COBOL", 
"ColdFusion", 
"Erlang", 
"Fortran", 
"Groovy", 
"Haskell", 
"Java", 
"JavaScript", 
"Lisp", 
"Perl", 
"PHP", 
"Python", 
"Ruby", 
"Scala", 
"Schema" 
]; 
Funktion split( val ) { 
return val.split( /,\s*/); 
} 
Funktion extractLast( Begriff ) { 
return split( Begriff ).pop(); 
} 

$( "#tags" ) 
//nicht zu navigieren Weg von dem Feld auf der Registerkarte, wenn Sie ein Element auswählen 
.bind( "keydown", function( event ) { 
if ( event.keyCode === $.ui.keyCode.REGISTER && 
$( this ).Daten( "autocomplete" ).Menü.active ) { 
event.preventDefault(); 
} 
}) 
.autocomplete({ 
minLength: 0, 
source: function( request, response ) { 
//Delegat zurück, AutoVervollständigen, sondern extrahieren Sie die Letzte Frist 
response( $.ui.AutoVervollständigen.filter( 
availableTags, extractLast( request.term ) ) ); 
}, 
focus: function() { 
//verhindern, dass der Wert eingefügt im Fokus 
return false; 
}, 
select: function( event, ui ) { 
var Begriffe = split( dies.Wert ); 
//löschen der aktuellen Eingabe 
Bedingungen.pop(); 
//fügen Sie das ausgewählte Element 
Bedingungen.push( ui.Element.Wert ); 
//Platzhalter hinzufügen, um die durch Komma und Leerzeichen am Ende 
Bedingungen.push( "" ); 
diese.Wert = Bedingungen.join( ", " ); 
return false; 
} 
}); 
});

EDIT: ich bin mit dem folgenden code auch auf anderen Seiten, um erfolgreich zu generieren Einzel-keywords aus meiner Datenbank, damit ich weiß, die *generate_keywords.php* Skript funktioniert und gibt Daten zurück, aber ich möchte Anzeige mehrere vorhandenen keywords genau wie in dem jQuery-Beispiel:

 $("#text-keywords").autocomplete({ 
Quelle: "generate_keywords.php", 
minLength: 2, 
select: function(event, ui) { 
$('#text-keywords').val(ui.Element.label); 
} 
});

Aber ich kann nicht herausfinden, wie man die "function( request, response )" aus dem Beispiel-code oben, um die Daten von meiner *generate_keywords.php* script. Ich habe gespielt, um mit der Verwendung des ajax () - Funktion, aber ich habe nicht hatte kein Glück.

Dank!

ist die generate_keywords.php richtig reagiert ? was ist seine Antwort ?
Ja, die generate_keywords.php gibt die folgende JSON-Ausgabe: [{"id":"48","label":"COMP_DATABASES"},{"id":"37","label":"COMP_GAMES"},{"id":"15","label":"COMP_GENERAL"},{"id":"34","label":"COMP_HARDWARE"},{"id":"31","label":"COMP_LINUX"},{"id":"36","label":"COMP_NETWORKING"},{"id":"55","label":"COMP_PALM"},{"id":"14","label":"COMP_SECURITY"},{"id":"33","label":"COMP_SOFTWARE"}]
Meinst du Sie wollen so etwas wie: COMP_DATABASES, COMP_HARDWARE, COMP_SOFTWARE etc. Art mehrere Einträge durch ","getrennt

InformationsquelleAutor ShinobiDev | 2011-02-08

  1. 4

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

    Überprüfen Sie den obigen link. Im Grunde müssen Sie rufen Sie Ihren server über "getJSON"

            .autocomplete({
            //blah-blah-blah
            source: function( request, response ) {
                $.getJSON( "search.php", {
                    term: extractLast( request.term )
                }, response );
            },
            //blah-blah-blah
    Wie kann ich einschränken, doppelte remote-Werten.?

    InformationsquelleAutor Alex

  2. 0
        $(function() {
        function split(val) {
            return val.split(/,\s*/);
        }

        function extractLast(term) {
            return split(term).pop();
        }
        $("#states_names").autocomplete({
            minLength: 4,
            source: function(request, response) {

                $.ajax({
//receives json array answer from the url
                    url: "search/state",
                    data: {
                        term: extractLast(request.term)
                    },
                    dataType: "json",
                    type: "POST",
                    success: function(data) {
                        response(data);
                    },
                    error: function() {
                        //added an error handler for the sake of the example
                        response($.ui.autocomplete.filter(
                            ["opt1","opt2"]
                            , extractLast(request.term)));
                    }
                });
            },
            focus: function() {
                //prevent value inserted on focus
                return false;
            },
            select: function(event, ui) {
                var terms = split(this.value);

                //remove the current input
                terms.pop();

                //add the selected item
                terms.push(ui.item.value);

                //add placeholder to get the comma-and-space at the end
                terms.push("");
                this.value = terms.join(",");
                return false;
            }
        });
    });

    InformationsquelleAutor Matteus Barbosa

Schreibe einen Kommentar