web-dev-qa-db-fra.com

Rappel Select2 et initSelection

Au chargement de la page, j'essaie d'utiliser initSelection pour sélectionner l'ID 60 (valeur spécifiée du champ de saisie) . Je n'arrive pas à le faire fonctionner correctement.

Les scripts PHP fonctionnent très bien et renvoient les valeurs correctes, mais comment puis-je faire en sorte que le JS fasse le rappel correctement?

JavaScript:

$(document).ready(function() {
    $('#editAlbumArtistId').select2({
            placeholder: 'Search names',
            ajax: {
                url: "/jQueryScripts/jQuerySelectListArtists.php",
                dataType: 'json',
                quietMillis: 100,
                data: function (term, page) {
                    return {
                        term: term, //search term
                        page_limit: 10 // page size
                    };
                },
                results: function (data, page) {
                    return {results: data.results};
                }

            },
            initSelection: function(element, callback) {

            var id = $(element).val();
            if(id !== "") {
                $.ajax("/jQueryScripts/jQuerySelectListArtists.php", {
                    data: {id: id},
                    dataType: "json"
                }).done(function(data) {
                    callback(data);
                });
            }
        }
    });
});

HTML:

<p>
    <input type='hidden' value="60" data-init-text='Search names' name='editAlbumArtistId' id='editAlbumArtistId' style="width:180px;"/>
</p>

Chaque fois que je rafraîchis la page, je vois que le script PHP est exécuté et qu'il renvoie l'ID et le texte appropriés. Cependant, le champ n'est pas mis à jour et j'ai sérieusement essayé tout ce que je peut penser.

J'utilise Select2 3.4.3.

Toute aide serait grandement appréciée.

jqueryjquery-select2
25
Mad Marvin

Enfin résolu! J'ai pensé select2 ne voulait pas de tableau car il s'agit d'une seule valeur, j'ai donc sélectionné le premier élément du tableau data.results.

callback(data.results[0]);

Et si vous avez défini multiple: true, acceptez simplement l'intégralité du tableau de résultats;

callback(data.results);
42
Mad Marvin

Vous pouvez également l'utiliser pour moins de code:

    initSelection: function(element, callback) {
        return $.getJSON("/jQueryScripts/jQuerySelectListArtists.php?id=" + element.val(), null, function(data) {
            return callback(data[0]);
        });
    }

J'ai vu cet exemple dans le wiki Select2, mais j'ai dû gérer le rappel (données) contre le rappel (données [0]) comme vous l'avez fait.

2
Juan Jose