Chosen: Von entfernter Datenquelle abrufen

Das ist ein bisschen besser als die automatische Vervollständigung von jquery, oder? Ich möchte irgendwann entfernte Datenquellen sehen (die Möglichkeit, einen Rückruf für die Suchergebnisse bereitzustellen)

Ich dritte diese Bitte. Dies wäre sehr praktisch, wenn Sie die Möglichkeit hätten, eine Remote-Quelle anzugeben, genau wie die automatische Vervollständigungsfunktion der jQuery-Benutzeroberfläche.

Oder vielleicht noch besser: Ausgewählte in jQuery UI einbinden. :)

+1

Genauer gesagt ist mein +1 für die Idee, eine Remote-Datenquelle mit Freitexteingabe zu verwenden (z. B. Verwendung von Ajax-Aufrufen zur Unterstützung des Tagging).

Entschuldigung, ich war nicht klar genug, aber die Integration von "Remote-Datenquellen" war das, was ich ursprünglich meinte, danke für den Hinweis. Natürlich ist dieses Plugin viel besser als die jQuery Auto Complete-Funktion. Wie daFish kommentierte, würde ich dies gerne als Teil der jQuery-Benutzeroberfläche selbst sehen.

+1 für die Unterstützung von Remote-Datenquellen

Ich verstehe es nicht. Bei Chosen geht es um bessere Benutzerfreundlichkeit und Schönheit von SELECT -Elementen, nicht um automatische Vervollständigung oder das Abrufen von Remote-Daten. Wenn Sie Remote-Daten wünschen, sammeln Sie sie und legen Sie sie vor dem Chosen Call in de DOM ab…

@juanghurtado : Wenn ich eine Mehrfachauswahlbox habe, die 300.000 Elemente enthält, kann ich sie nicht wirklich vollständig in HTML schreiben. Chosen bietet die perfekte Oberfläche zum Suchen und Auswählen. es gibt viele andere Bibliotheken, die diese Funktionalität bieten, zB [1], [2] und viele mehr. Von all diesen funktioniert Chosen am besten, aber es unterstützt keine sehr großen Sammlungen - was die Unterstützung für Remote-Datenquellen hinzufügen würde. Wenn Chosen dies unterstützen würde, würde dies außerdem bedeuten, dass ein Plugin anstelle von zwei geskinnt und auf dem neuesten Stand gehalten werden müsste.

[1] http://loopj.com/jquery-tokeninput/
[2] http://wharsojo.wordpress.com/2008/02/18/jquery-facebook-autocomplete/

Nun, wenn Sie 300.000 Artikel auf Ihrem SELECT -Artikel haben, machen Sie (IMHO) etwas falsch ... Es gibt viele Optionen, um diese Schnittstelle besser zu handhaben.

Auserwählte könnten viele Dinge tun … Wie schicke Armeemesser könnte es viele Dinge tun (Remote-Datenquellen, Bildzuordnung zu Elementen, benutzerdefinierte Filterung, AJAX-Abfragen …) und nicht mehr das perfekte Werkzeug für nur einen sein (bessere Schnittstelle für traditionelle SELECT Elemente).

El 10/08/2011, um 22:56, ivaynberg escribió:

@juanghurtado : Wenn ich eine Mehrfachauswahlbox habe, die 300.000 Elemente enthält, kann ich sie nicht wirklich vollständig in HTML schreiben. Chosen bietet die perfekte Oberfläche zum Suchen und Auswählen. es gibt viele andere Bibliotheken, die diese Funktionalität bieten, zB [1], [2] und viele mehr. Von all diesen funktioniert Chosen am besten, aber es unterstützt keine sehr großen Sammlungen - was die Unterstützung für Remote-Datenquellen hinzufügen würde. Wenn Chosen dies unterstützen würde, würde dies außerdem bedeuten, dass ein Plugin anstelle von zwei geskinnt und auf dem neuesten Stand gehalten werden müsste.

[1] http://loopj.com/jquery-tokeninput/
[2] http://wharsojo.wordpress.com/2008/02/18/jquery-facebook-autocomplete/

Antworten Sie direkt auf diese E-Mail oder sehen Sie sie auf GitHub an:
https://github.com/harvesthq/chosen/issues/79#issuecomment -1776643

dem kann man eigentlich nicht widersprechen...

Ich möchte Remote-Daten erhalten, wenn ich von ausgewählten suche, wie z. B. das jquery autocomplete-Plugin, bitte helfen Sie mir

+1, um Unterstützung für Remote-Daten zu haben.

Jeder Blick auf Ihre Benutzeroberfläche ist nett, aber einige Probleme sind vorhanden, wie z. B. keine Unterstützung von Remote-Daten.

Ich denke, das ist machbar, aber nicht so einfach, wie man vielleicht denkt. Da dies Github und Open Source ist, schauen wir uns etwas Code an.

@juanghurtado Ich denke auch, dass wir dies tun können, ohne die vorhandene Funktionalität aufzublähen, sowohl jquery als auch der Prototyp geben uns alles, was wir für entfernte Datenquellen brauchen.

results_search() scheint während des Tastendrucks ausgelöst zu werden - dort würde ich das Standardverhalten von selected überschreiben. Ich muss etwas tiefer graben, aber es sieht so aus, als könnten wir winnow_results() nachahmen und eine Möglichkeit hinzufügen, das Ladeverhalten anzuzeigen (z. B. winnow_loading_results()), dies könnte gut funktionieren.

Eine weitere zu betrachtende Funktion ist winnow_results_clear();

Der schwierige Teil besteht darin, herauszufinden, wie dies reibungslos in Chosen integriert werden kann. Sollte es in den Optionen sein? Soll es nur eine Unterklasse sein? Und würden die Core-Entwickler das in das Master-Projekt einfließen lassen?

Eigentlich sollten wir dieses Thema schließen, es wird viel an #162 gearbeitet, was alles zu sein scheint, was wir uns wünschen.

Ich dachte nur, ich würde hinzufügen, dass diese Funktionalität heutzutage ein Muss ist, und ich hoffe wirklich, dass sie bald implementiert wird. In jeder anderen gewählten Weise ist perfekt. :)

Was ist mit dem Problem beim Abrufen aus einer Remote-Datenquelle passiert?

Zeit für @pfiller , sich dem Gespräch anzuschließen, denke ich.

+1 Ich würde das gerne sehen

Ich lade die Remote-Werte sofort, wenn die Seite bereitgestellt wird. Wenn ich also keine neuen Daten aktualisieren oder abrufen kann, wenn ich zumindest neue Optionen zur Auswahl hinzufügen könnte, könnte ich die Clientseite beibehalten, bis die Seite aktualisiert wird. Also +1 für das Fernabrufen und/oder +1 für die Möglichkeit, neue Optionen hinzuzufügen. Hoffe das macht Sinn...

+1 für Jaloka-Anfrage

Ich habe eine Tabelle mit 17500 Datensätzen und wenn ich die Seite lade, wird sie langsam und stürzt schließlich ab ... Ich denke, wenn die Suche nach Übereinstimmungen in der Tabelle implementiert werden könnte, wäre dies das Beste.

Jemand hat es implementiert: https://github.com/meltingice/ajax-chosen

Ich bin kein jQuery-Guru und eigentlich weiß ich nichts darüber. Verzeihen Sie also bitte meine ahnungslose Art, die Dinge zu erklären. Mir fehlen wirklich die richtigen Worte, um mein Problem zu beschreiben. Ich habe einfach diese einfache Anweisung befolgt: eine Klasse hinzugefügt, das Skript eingefügt und die Funktion aufgerufen. Alles funktionierte großartig, außer der Seite, die keine ausgewählte Eingabe enthielt. Und ich bin mir nicht sicher, ob Daten mit Hilfe von Ajax gehen. Ich kann nur annehmen, dass Formulare aus der Tabelle der MySQL-Datenbank generiert werden. Wählen Sie die Eingabeoptionen von dort aus. So sah es zumindest aus, als ich die Seite bearbeitet habe. Wenn ich also die Seite lade, sehe ich in meiner Auswahleingabe nur die Klasse „chzn-select“, was bedeutet, dass das Skript überhaupt nicht funktioniert. Beim Lesen verwandter Probleme habe ich verstanden, dass es an einer Remote-Datenquelle liegt, aber ich verstehe nicht, wie ich es beheben kann. Eigentlich verstehe ich nicht wirklich, wovon ihr hier redet. Ich habe Ajax-Chosen wie oben angegeben ohne Erfolg ausprobiert und ich habe andere hier erwähnte 'Hacks' ausprobiert. Kann mir jemand mit einfachen Worten erklären, ob es in meinem Fall möglich ist, etwas zu tun oder nicht?

Ich verwende jQuery 1.4.2 und habe es sowohl unter Mac OS als auch unter Windows versucht. Sie können es hier überprüfen: http://94.125.8.168/eng/ (klicken Sie auf die Registerkarte „Suchen“ oder „Flugplan“ im mittleren Block namens „Fluginformationen“). Wählt Reiseziel, Flugnummer und Flughafen aus.

@ffiona Sie müssen Ihren Chosen-Aufruf in eine jQuery-fähige Funktion einschließen.

$(document).ready(function() {
  $(".chzn-select").chosen();
});

Bitte versuchen Sie, zukünftige Fragen für einen Thread themenbezogen zu halten. Wenn Sie eine Frage haben, können Sie gerne ein neues Thema eröffnen.

@pfiller ist das eine Funktion, an der ihr arbeitet oder arbeiten werdet? Ich habe alle anderen Ajax-Chosen-Hacks ausprobiert, aber keiner von ihnen funktioniert wirklich. Ich brauche das wirklich, weil ich an einer Börsen-App arbeite, in die der Benutzer Aktiensymbole eingibt, die, wie Sie wissen, Zehntausende davon haben können.

@all , es scheint, als wäre meine Option, die Ajax-Autovervollständigung aus der Auswahl zu erhalten, ein langer Schuss, und ich muss möglicherweise nach Alternativen suchen. Kann jemand andere Alternativen zu Ausgewähltem mit dieser Funktion empfehlen?

Ich habe kürzlich auch eine erstellt. https://github.com/ksykulev/chosen-ajax-addition

@ksykulev hast du zufällig irgendwo eine Live-Demo davon?

@jaequery
Einfach mal schnell ein Beispiel zusammen gehackt http://sykulev.com/ajaxchosen/index.html

Ich habe den Code unter /example in meinem Repository hinzugefügt.

@ksykulev : Ihre Version macht einen wirklich tollen Job mit Einzelauswahlen, danke! Übrigens funktioniert es nicht mit Multiselect. Ich kann mir das mal anschauen, wenn ich etwas Zeit habe.

Die Version von @meltingice macht auch wirklich seltsame Dinge bei Multiselect, ich denke, das liegt daran, dass sie überhaupt keine Chosen-Funktionen verwendet (also sind alle Dinge, die in der ursprünglichen Lib natürlich gelöst werden, nicht in der Ajax-Version, zum Beispiel die Neupositionierung von Eingaben und Größenanpassung, nachdem die Ergebnisse an den Client zurückgesendet wurden).

@jbbarth : Ja, du hast Recht, ich habe es nicht mit Multiselects getestet, also kann ich mir nur vorstellen, dass es nicht sehr gut funktioniert. In Bezug auf die Vollständigkeit meiner Bibliothek kann ich diese definitiv unterstützen. Ich werde darauf eingehen. Danke!

Am Ende habe ich meine eigene Version entwickelt, deren Look and Feel auf Chosen basiert.

https://github.com/ivaynberg/select2

Es unterstützt Ajax/Jsonp-Remote-Datensätze und unendliches Scrollen (träges Laden von ausgelagerten Remote-Datensätzen). noch keine Unterstützung für Multiselect.

@ivaynberg Ich bin alle Augen darauf.

Sobald Sie mit Chosen auf Feature-Parodie gestoßen sind (insbesondere Tag-ähnliche Multiselect-Unterstützung), sollten Sie diesen Thread auf jeden Fall anstoßen.

Ich liebe das Aussehen und die Haptik von Chosen, aber die Umsetzung lässt wirklich zu wünschen übrig.

Sehr, sehr schöne Arbeit!

@ivaynberg Mir ist aufgefallen, dass Sie immer noch Code von selected haben, der speziell Dropdown- und Sucheingabebreiten berechnet.

Vielleicht möchten Sie dies überprüfen: https://github.com/harvesthq/chosen/pull/407

Ich habe kürzlich meine ausgewählte Ajax-Version aktualisiert, um mehrere Auswahlen zu unterstützen. http://sykulev.com/ajaxchosen/index.html

@justindujardin Select2-Master hat jetzt Feature-Parität. Ich werde mir die Dimensionierung in 407 ansehen, aber wir sollten weitere Diskussionen zum Projekt von Select2 führen.

Ich liebe Select2 und ich empfehle JEDEM, darauf umzusteigen. Heh.

@ProLoser – danke dafür ... genau das, wonach ich gesucht habe. Sieht nach einer viel besseren Option aus.

Wählen Sie 2 FTW!

Select2 ist der richtige Weg!

Irgendwelche Updates nach all den Jahren?

Warum fehlt eine solche Imp-Funktion?

hm... das stinkt. Ich entschied mich wegen der Texthervorhebung für Chosen, wusste aber nicht, dass AJAX so schwierig hinzuzufügen sein würde. Ich denke, ich hätte mich für select2 entscheiden sollen, wenn jeder von hier aus dorthin springt, um die Anforderungen zu erfüllen. :(

Es ist eine großartige Funktion. Viele Gabeln schlagen diese Funktion vor, aber die Implementierung ist oft chaotisch. :+1:

Ich habe mir eine einfache Monkey-Patch-Lösung ausgedacht:

AbstractChosen.prototype.winnow_results = (function(winnow_results) {
  return function() {
    if (this.options.source) {
      return this.options.source.call(this.form_field, this.search_field.val(), (function(_this) {
        return function(results) {
          var id, option, select;
          if (results) {
            select = document.createElement('select');
            select.appendChild(document.createElement('option'));
            for (id in results) {
              if (results.hasOwnProperty(id)) {
                option = document.createElement('option');
                option.value = id;
                option.textContent = results[id];
                select.appendChild(option);
              }
            }
            _this.results_data = SelectParser.select_to_array(select);
          }
          return winnow_results.call(_this);
        };
      })(this));
    } else {
      return winnow_results.call(this);
    }
  };
})(AbstractChosen.prototype.winnow_results);

Sie können eine 'Quell'-Funktionsoption für Ausgewählte bereitstellen, die beim Rendern der Ergebnisse aufgerufen wird. Es hat String-Eingabewerte und Callback-Funktionsargumente. Die Callback-Funktion macht Vorschläge. Wenn sich die Ergebnisse nicht geändert haben sollten, dann sollten Sie es sofort ohne Argumente aufrufen, ansonsten können Sie Ergebnisse anfordern und an den Callback senden, wenn Sie sie haben. Das Ergebnisobjekt hat dieses Format: { value: "label", value2: "label2" } . Hier ist ein Beispiel:

var select = $("#select"),
    value;
select.chosen({
    source: function (val, callback) {
        if (value != val) {
            value = val;
            $.get('/suggestions', { value: value }, callback);
        } else
            callback();
    }
});

Was @faucct vorschlägt, scheint zu funktionieren. Eine kleine Anmerkung ist jedoch, dass Sie, wenn Sie die jquery-Version verwenden, außerhalb des ausgewählten Bereichs nicht auf AbstractChosen zugreifen können. Daher möchten Sie diese Dateien wahrscheinlich zum ausgewählten Bereich hinzufügen, oder Sie müssen die ausgewählte js-Datei ändern und verschieben Sie AbstractChosen und SelectParser in den globalen Geltungsbereich. Ein weiteres Problem besteht darin, dass es die offene Liste (die von der Auswahl erstellten div-Elemente) aktualisiert, aber nicht das eigentliche "Auswahlfeld", daher kann eine von Ihnen ausgewählte Option, wenn sie nicht in der Auswahl vorhanden ist, einen Fehler auslösen. Beachten Sie auch, dass die von Ihnen geschriebene Zeichenfolge auch zum Filtern der von Ihnen zurückgegebenen Ergebnisse verwendet wird. Es funktioniert auch jedes Mal, wenn Sie etwas eingeben, sodass Sie manuell steuern können, keine Anrufe zu tätigen.

Ich habe eine andere Erweiterung gefunden: https://github.com/meltingice/ajax-chosen

Es funktioniert ziemlich gut, aber die aktuelle Version ist kaputt, Sie müssen einige kleinere Änderungen vornehmen. Sie müssen "chzn" durch "chosen" ersetzen, da die ausgewählte Bibliothek ihre internen CSS-Namen geändert hat. Die letzte Änderung, die Sie vornehmen müssen, ist, " selected: updated " anstelle von " listz:updated " auszulösen. In der Readme-Datei werden Sie aufgefordert, einen Fehler im CSS zu beheben, der jedoch in neueren Versionen bereits behoben ist, sodass Sie dies nicht tun müssen. Sie können auch einige nützliche Optionen einstellen und wenn der Benutzer weiter schreibt, storniert das System auch die ausstehenden Anrufe.

Das war meine Reise :), hoffe es hilft.

Ich habe dieses Problem gelöst, indem ich ein Plugin erstellt habe, das die Remote-Datenquelle für ausgewählte verwaltet. Ich hoffe, Sie alle können es genießen

ausgewählte Remote-Quelle (https://github.com/westonganger/chosen-remote-source)

Der gesamte Code ist mit weniger als 200 Codezeilen ziemlich einfach
https://github.com/westonganger/chosen-remote-source/blob/master/src/chosen-remote-source.js

Der einzige Teil von Chosen, der zum Patchen benötigt wurde, war der folgende:

// MONKEY PATCH CHOSEN TO NOT CLEAR THE SELECTED RESULTS UPON SEARCHING WITH
chosen_prototype.show_search_field_default = function() {
  if (this.is_multiple && this.choices_count() < 1 && !this.active_field) {
    this.search_field.val(this.default_text);
    return this.search_field.addClass("default");
  } else {
    if(this.default_text === this.search_field.val()){
      this.search_field.val(""); // ORIGINAL LINE, SURROUNDING IF STATEMENT IS CUSTOM
    }

    return this.search_field.removeClass("default");
  }
};
// END CHOSEN PATCH