initSelection n'est pas appelé dans le plugin jQuery select2

Je suis en utilisant select2 plugin jquery de http://ivaynberg.github.io/select2/.

Je suis à l'aide de code suivant.

 $(document).ready(function () {
$("#e6").select2({
placeholder: "Search for a movie",
minimumInputLength: 1,
ajax: { //instead of writing the function to execute the request we use Select2's convenient helper
url: "http://api.rottentomatoes.com/api/public/v1.0/movies.json",
dataType: 'jsonp',
quietMillis: 1000,
data: function (term, page) {
return {
q: term, //search term
page_limit: 10,
apikey: "ju6z9mjyajq2djue3gbvv26t" //please do not use so this example keeps working
};
},
results: function (data, page) { //parse the results into the format expected by Select2.
//since we are using custom formatting functions we do not need to alter remote JSON data
return { results: data.movies };
}
},
initSelection: function (element, callback) {
var id = 9942;//$(element).val();
alert('initSelection');
if (id !== "") {
$.ajax("http://api.rottentomatoes.com/api/public/v1.0/movies/" + id + ".json", {
data: {
apikey: "ju6z9mjyajq2djue3gbvv26t"
},
dataType: "jsonp"
}).done(function (data) { callback(data); });
}
},
formatResult: movieFormatResult, //omitted for brevity, see the source of this page
formatSelection: movieFormatSelection,  //omitted for brevity, see the source of this page
dropdownCssClass: "bigdrop", //apply css that makes the dropdown taller
escapeMarkup: function (m) { return m; } //we do not want to escape markup since we are displaying html in results
});
});
$(document).ready(function () {
$("#e6").on("select2-selecting", function (e) {
var v = 10;
alert("selecting val=" + e.val + " choice=" + JSON.stringify(e.choice));
var id = document.getElementById('<%= savebtn.ClientID %>');
id.value = e.val;
id.click();
});
});

Problème: Pour certaines raisons initSelection n'est pas appelé et de ce fait, je ne suis pas en mesure de définir une valeur pour la zone de texte à travers l'après-dos.

Je suis en utilisant le chargement à distance des données exemple de http://ivaynberg.github.io/select2/ site.

J'ai regardé la la documentation pour initSelection et il dit "Cette fonction sera appelée uniquement lorsqu'il y a apport initial pour être traitées.", Je ne suis pas sûr de ce qu'il signifie.

Je fais quelque chose de mal? S'il vous plaît aider

source d'informationauteur SharpCoder

  1. 22

    Vous devez fournir la valeur initiale:

    <input ... value="192" ... />

    ou

    $('#e6').select2('val', 192);

    Pour plusieurs valeurs, soit:

    <input ... value="192,193" ... />

    ou

    $('#e6').select2('val', [192,193]);

    Voir JSFiddle.

  2. 6

    Vous pouvez le faire tout simplement comme cela si vous ne voulez pas utiliser une valeur par défaut.

    $(document).ready(function () {
$("#e6").select2({
...
},
initSelection: function (element, callback) {
...
},
formatResult: movieFormatResult, //omitted for brevity, see the source of this page
formatSelection: movieFormatSelection,  //omitted for brevity, see the source of this page
dropdownCssClass: "bigdrop", //apply css that makes the dropdown taller
escapeMarkup: function (m) { return m; } //we do not want to escape markup since we are displaying html in results
}).select2('val', []);
});

    Ajoutant select2('val', []); à la fin de la déclaration de résoudre ce problème.

  3. 0

    Eh bien c'est ce que je fais pour les situations plus complexes, car s'il est pas contrôlée initalvalue est enregistré dans la base de données (en coffeescript)

     if $("#categories").val().length is 0 
$("#categories").val "initialValue"
$("#categories").select2
closeOnSelect:false
containerCssClass: "select2-default"
formatNoMatches: ->
I18n.t "shared.navbar.no_matches_found"
formatInputTooShort: (input, min) ->
I18n.t("shared.navbar.please_select") + " " + (min - input.length) + " " + I18n.t("shared.navbar.more_characters")
formatSelectionTooBig: (limit) ->
I18n.t("shared.navbar.you_can_only_select") + " " + limit + " " + I18n.t("shared.navbar.item") + ((if limit is 1 then "" else "s"))
formatLoadMore: (pageNumber) ->
I18n.t "shared.navbar.loading_more_results"
formatSearching: ->
I18n.t "shared.navbar.searching"
minimumInputLength: 3
width: "100%"
multiple: true
ajax:
url: "/categories/list_styles"
dataType: "json"
quietMillis: 100
data: (term, page) ->
q: term
page_limit: 10
page: page
results: (data) ->
hashtable = {}
results = []
$.each data, (index, item) ->
if hashtable[item.parent] is `undefined`
hashtable[item.parent] =
text: item.parent
children: []
results.push hashtable[item.parent]
hashtable[item.parent].children.push
id: item._id
text: item.title
results: results
initSelection: (element, callback) ->
data1 = []
if element.val() is "initialValue"
element.val('')
jQuery(element.val().split(",")).each ->
$.ajax
type: "get"
url: "/providers/list_categories"
async: false
dataType: "json"
data: { id: $("#provider_id").val(), selected: $("#categories").val().split(",") }
success: (category) ->
$.each category, (i, obj) ->
data1.push
id: @_id
text: @title
callback data1
$.each $(".select2-container"), (i, n) ->
$(n).next().show().fadeTo(0, 0).height("0px").css "left", "auto" # make the original select visible for validation engine and hidden for us
$(n).prepend $(n).next()
$(n).delay(500).queue ->
$(this).removeClass "validate[required]" #remove the class name from select2 container(div), so that validation engine dose not validate it
$(this).dequeue()
  4. 0

    Utiliser ceci:

    supprimer le précédent options options:

           arr = json.filter(function( obj ) {
return  arrSelectedValues.indexOf(obj.foo) == -1;
});

    et créer un nouvel élément sélectionné:

            option = document.createElement('option');
option.value = 'foo';
option.innerHTML = 'foo';
option.selected = true;
document.getElementById('selectFoobares').appendChild(option);

    pas le meilleur moyen mais fonctionne