Ich hoffe, dass meine Frage einen Sinn ergibt - ich war mir nicht sicher, wie ich das am besten beschreiben könnte. Ich habe eine gruppierte Select2 Select-Formular-Eingabe etwa wie folgt:
Du fängst also an, App einzugeben, und natürlich bekommst du Apples aus dem Drop-down Select2. Wenn Sie veg eingeben, erhalten Sie Vegemite und die Vegetables Gruppenüberschrift, aber alle Optionen sind ausgeblendet. Ich möchte alle Gruppenoptionen sichtbar lassen, wenn ein Suchbegriff mit der Gruppenüberschrift übereinstimmt.
Ich habe etwas im Quellcode von select2 gegraben und ich denke, dass es eigentlich einfach ist, aber ich könnte falsch liegen und wenn ich recht habe, bleibe ich dran, wie ich es zum Laufen bringen kann. Hier ist der Quellcode: Ссылка :
und ein von mir erstellter Gist im Gegensatz zu dem Versuch, ihn hier einzufügen:
Ich habe die Reihenfolge des Codes geändert und einige geringfügige Namensänderungen vorgenommen, um dies widerzuspiegeln. Ich denke, das würde die Optionsgruppe offen halten. Ich habe versucht, einen benutzerdefinierten Matcher basierend darauf zu erstellen (siehe mein Gist), aber ich steckte an dem Punkt fest, an dem es DIACRITICS :
Nach einigem Googeln wurde mir klar, dass dies Akzentbuchstaben ersetzt, von denen ich weiß, dass ich sie nicht habe, also habe ich diesen Teil entfernt.
Jetzt schlägt mein Matcher mit TypeError: data.indexOf is not a function. (In 'data.indexOf(term)', 'data.indexOf' is undefined)
Fehlern in meinem Browser fehl.
Ich bin mir sicher, dass ich mir hier sehr nahe bin, aber ich bin ein bisschen über meinen Kopf und jenseits meiner Erfahrung und / oder Fähigkeiten, um das zu beenden. Alle Hinweise oder Ideen würden geschätzt.
AKTUALISIEREN
Hier ist eine JSfiddle mit was ich arbeite:
Was ich aus Ihrer Frage entnehme, ist, dass Sie option s zur Auswahl anzeigen können, wenn eine Übereinstimmung in option text ODER option des übergeordneten Attributs optgroup besteht.
Das ist relativ einfach: Betrachte hauptsächlich beide Werte und wenn beide übereinstimmen, return true mit der Option matcher von Select2:
(Hinweis: Verwenden von Select2 v3.5.4.)
%Vor% v4. * und höher haben term und text zu einem komplexeren Objekt geändert, so dass es etwas anders aussieht, aber das Hauptkonzept ist dasselbe. Wie Sie sehen können, benutze ich nur jQuery, um bis zum übergeordneten Element option zu selektieren, wenn es sich um ein optgroup -Element handelt, und dieses in die matcher -Kontrolle einzubeziehen.
Außerdem wird ein optgroup an, wenn irgendetwas davon Kinder angezeigt, so dass Sie nur über Anzeigen eines oder mehrerer des option 's kümmern, und nicht wirklich ‚show‘% des% co_de durch manuelle zeigt es.
Wenn Sie eine andere Anforderung haben, stellen Sie bitte eine (funktionierende / nicht funktionierende?) Demonstrationsgeige zur Verfügung, die zeigt, wo Sie sie haben können.
BEARBEITEN
Die benutzerdefinierte Anpassung von Select2 wurde mit Version 4.0 erheblich geändert. Hier ist ein eigener Matcher, die auf diese GitHub Ausgabe gebucht wurde. Es ist, wie folgt, zur Vollständigkeit wiedergegeben.
Beachten Sie, dass es für sich selbst untergeordneten Elemente ruft (die optgroup Elemente innerhalb der option Elemente), so optgroup läuft sowohl gegen die modelMatcher() und die optgroup Elemente , aber die kombinierte Menge wird zurückgegeben, nachdem die Elemente option und optgroup entfernt wurden, die nicht übereinstimmen. In der obigen Version haben Sie jedes option -Element erhalten und haben einfach true / false zurückgegeben, wenn Sie es (und das übergeordnete Element) anzeigen wollten. Nicht das viel komplizierter, aber Sie müssen darüber ein wenig mehr nachdenken.
Tags und Links javascript jquery jquery-select2 jquery-select2-4 select2