it-swarm.com.de

JSON-Format für Jquery-Select2 Multi mit Ajax

Ich denke dabei an, von Ausgewählt zu Select2 zu wechseln, da Select2 native Methoden für Ajax hat. Ajax ist kritisch, da Sie normalerweise viele Daten laden müssen. 

Ich habe das Beispiel mit der JSON von api.rottentomatoes.com/api/ erfolgreich ausgeführt

Ich habe eine JSON-Datei gemacht, um den Ajax zu testen, aber es funktionierte nicht.

Ich weiß nicht, wie das JSON sein soll. Es scheint, dass es keine detaillierte Dokumentation gibt:

https://github.com/ivaynberg/select2/issues/920

Ich habe verschiedene JSON-Formate erfolglos ausprobiert, also habe ich versucht, ein JSON-Format ähnlich wie api.rottentomatoes zu kopieren, aber es funktioniert nicht. 

Ich vermisse vielleicht etwas Dummes.

function MultiAjaxAutoComplete(element, url) {
    $(element).select2({
        placeholder: "Search for a movie",
        minimumInputLength: 1,
        multiple: true,
        ajax: {
            url: url,
            dataType: 'jsonp',
            data: function(term, page) {

                return {
                    q: term,
                    page_limit: 10,
                    apikey: "z4vbb4bjmgsb7dy33kvux3ea" //my own apikey
                };
            },
            results: function(data, page) {
                return {
                    results: data.movies
                };
            }
        },
        formatResult: formatResult,
        formatSelection: formatSelection,
        /*initSelection: function(element, callback) {
            var data = [];
            $(element.val().split(",")).each(function(i) {
                var item = this.split(':');
                data.Push({
                    id: item[0],
                    title: item[1]
                });
            });
            //$(element).val('');
            callback(data);
        }*/
    });
};

function formatResult(node) {
    return '<div>' + node.id + '</div>';
};

function formatSelection(node) {
    return node.id;
};


/*MultiAjaxAutoComplete('#e6', 'http://api.rottentomatoes.com/api/public/v1.0/movies.json');*/

MultiAjaxAutoComplete('#e6', 'https://raw.github.com/katio/Quick-i18n/master/test.json');

$('#save').click(function() {
    alert($('#e6').val());
});

Ich habe dieses Jsfiddle gemacht:

http://jsfiddle.net/Katio/H9RZm/4/

17

Wenn Sie zu JSON gewechselt haben, stellen Sie sicher, dass Sie dataType von JSONP zu JSON wechseln.

Das Format wird hier angegeben: http://ivaynberg.github.io/select2/#doc-query

Die JSON sollte so aussehen:

{results: [choice1, choice2, ...], more: true/false }

Grundsätzlich ist das einzige erforderliche Attribut bei der Auswahl die Variable id. Wenn die Option andere untergeordnete Optionen enthält (z. B. bei optgruppenähnlichen Auswahlmöglichkeiten), werden diese im Attribut children angegeben.

Der Standardauswahl- und -auswahl-Renderer erwartet bei jeder Auswahl ein text-Attribut - dies wird verwendet, um die Auswahl zu rendern.

so könnte ein vollständiges Beispiel eines US-Bundesstaates, der den Standard-Renderer verwendet, folgendermaßen aussehen:

{
    "results": [
        {
            "id": "CA",
            "text": "California"
        },
        {
            "id": "CO",
            "text": "Colarado"
        }
    ],
    "more": false
}

Ich hoffe, dass Sie damit beginnen.

32
igor.vaynberg

Offizielle Dokumentation für das erforderliche JSON-Format: Ref. https://select2.org/data-sources/formats

{
  "results": [
    {
      "id": 1,
      "text": "Option 1"
    },
    {
      "id": 2,
      "text": "Option 2"
    }
  ],
  "pagination": {
    "more": true
  }
}
0
Nicola Beghin