2013-07-16 7 views
11

Ho una selezione secondaria asservita a una selezione primaria (selezionare un negozio, quindi selezionare un reparto - identico a selezionare un paese, quindi selezionare uno stato).select2 non disabiliterà o cancella

Non riesco assolutamente a ottenere i metodi select2 ('enable', false) e ('data', null) per funzionare, non importa quanto altro codice io strappi.

<select id="stores"> 
    <option value="foo">foo</option> 
</select> 
<select id="depts"> 
    <option value="bar">bar</option> 
</select> 

// ...some logic that selects a store, then fetches that store's depts ... 

$('#depts').select2('enable',false);// does not disable control 
$('#depts').select2('data',null); // does not clear control 

Quindi sono costretto a fare questo:

$('select#depts').empty(); // clears HTML element 
$('#depts').select2(); // re-enhances select w/ select2 
$('#depts').select2('disable',true); // disables 

Si comporta in jsfiddle, quindi non può nemmeno pubblicare un aiuto esempio e richiesta. Sono solo ... perplesso.

risposta

0

vorresti non richiede questo:.

$ ('#') depts prop ('disabilitato', false);

stessa this question

+0

Questa ricerca ion non è uguale a quello che hai collegato poiché usa il plugin select2, non è una semplice selezione disabilitata. –

5

Probabilmente stai vivendo select2 bug 1104. Sfortunatamente è ancora un problema in IE8-10, ma non è colpa di select2. Il problema è che IE non attiva l'evento propertychange quando un elemento è disabilitato e inoltre non implementa la funzionalità MutationObserver utilizzata da altri browser. Fortunatamente, c'è un piccolo plugin jQuery che ho scritto che permetterà all'evento propertychange di essere attivato quando un elemento è disabilitato. Lo puoi trovare here.

$('#originalSelect').fireOnDisable().select2(); 
$('#originalSelect').prop('disabled', true); 

ora dovrebbe funzionare in IE8-10. Se hai bisogno di supportare IE6-7, sei da solo!

+0

In IE9/IE10 l'attributo disable non funziona per multiplo select2. – Misi

+0

IE8-10 non hanno alcun * attributo * watcher, solo watch watcher - quindi potresti riscontrare un problema in cui stai impostando l'attributo e non la proprietà - nei miei test funziona perfettamente con jquery.prop(), but not .attr() – cmcnulty

11

questo funziona per me in tutti i browser:

$('#statusSelect').select2('destroy'); 
$('#statusSelect').prop('disabled', true); 
$('#statusSelect').select2(); 

Che ti dà un ingresso select2 disabilitato.

Per ri-abilitato semplicemente:

$('#statusSelect').select2('destroy'); 
$('#statusSelect').prop('disabled', false); 
$('#statusSelect').select2(); 

Il lato negativo è che questo fa sì che la tua casella di selezione per cambiare l'aspetto di una frazione di secondo, quando select2 viene distrutto e riapplicato.

Inoltre, "readonly" e "disabled" non sono supportati nelle versioni precedenti di select2.

28
// to disable 
$('#statusSelect').select2('disable'); 

//to enable 
$('#statusSelect').select2('enable'); 
1

Per IE si deve ri inizializzare select2 dopo abilitare/disabilitare

// change action disable 
$('.custom-select').select2() 
.on("change", function(e) { 
    $('.custom-select').prop("disabled", true).select2(); //call select2 
}) 

// disable alternative 
$('.custom-select').prop("disabled", true).select2(); //call select2 
2

Se si dispone di ID univoco per select2 casella a discesa, utilizzando tale id,

$("#id-select2").attr("disabled", true); 
0

Se qualcuno è provando a farlo in .net server code:

this.mySelect2elementID.Attributes.Add("disabled", "true");