Dieser Artikel fasst die Verwendung des Komponenten Bootstrap Select2 in einigen tatsächlichen Projekten zusammen. Es wird mit Ihnen geteilt. Bedürftige Freunde können daraus lernen und Umwege vermeiden. Der spezifische Inhalt ist wie folgt
Reproduktionsbild:
Ob es darum geht, Daten auf feste Weise zu erhalten oder AJAX zu erhalten, stootstrap.js/css und select2.js/css und:
oder stylesheet_link('css/prettify.css') }} {{ javascript_include('js/lib/jquery.js') }}{{ javascript_include('js/lib/select2.full.js') }}{{ javaScript_include ('js/lib/bootstrap.js')}} <div> <Section id = "tags"> <div> <p> <ausgewählte multiple = "multiple"> <option ausgewählt = "ausgewählt"> orange </option> </option> White </option> <options ausgewählt = "Selected"> lila> </option> </option> </div> </abschnitt> </div> </div>Fester Weg, um zu erhalten:
$ (". JS-Example-Tags"). SELECT2 ({Tags: true, // Kannst du Tag CreateSearchChoice: Funktion (Term, Data) {alert (1); if ($ (data) .filter (function () {return this.text.LocalCompare (term) === 0;}). multiple: true, data: [{id: 0, text: 'story'}, {id: 1, text: 'bug'}, {id: 2, text: 'task'}]});AJAX -Methode erhalten:
$ (". JS-example-tags"). Select2 ({// Tagging-Tags aktivieren: TRUE, // Remotedaten laden // siehe https://select2.github.io/Options.html#ajax Ajax: {url: "Ask2/Tags", processResults: function: function (data, data, page [];veranschaulichen
Das Datenrückgabeformat in AJAX sollte so aussehen: [{id: 0, text: 'story'}, {id: 1, text: 'bug'}, {id: 2, text: 'task'}]
Entsprechendes Beispiel für PHP -Code
... $ p1 = array (id => "1", text => "java"); $ p2 = array (id => "2", text => "jvm"); $ test = Array (1 => $ P1,2 => $ P2); $ params ['reagedata'] = $ test; $ this-> view-> disable (); Return Parent :: ajaxResponse ($ params);
Wenn Sie weiterhin ausführlich studieren möchten, können Sie hier klicken, um Ihnen zu studieren und 3 aufregende Themen anzuhängen:
Bootstrap -Lern -Tutorial
Bootstrap Practical Tutorial
Bootstrap-Plug-in-Nutzungs-Tutorial
Das obige ist eine Einführung in einige Verwendungsmethoden von Select2. Ich hoffe, es wird für das Lernen aller hilfreich sein.