Modifica della selezione in un selezione con il plugin scelto
-
12-11-2019 - |
Domanda
Sto provando a modificare l'opzione attualmente selezionata in una selezione con il plugin scelto.
Il documentazione Coperchi di aggiornamento dell'elenco e attivare un evento quando viene selezionata un'opzione, ma nulla (che posso vedere) sulla modifica esternamente del valore attualmente selezionato.
Ho fatto un jsfiddle per dimostrare il codice e i miei tentativi di cambiare la selezione:
$('button').click(function() {
$('select').val(2);
$('select').chosen().val(2);
$('select').chosen().select(2);
});
Soluzione
Dalla sezione "Aggiornamento in modo dinamico scelto" nella Documenti: È necessario attivare l'evento "scelto: aggiornato" sul campo
$(document).ready(function() {
$('select').chosen();
$('button').click(function() {
$('select').val(2);
$('select').trigger("chosen:updated");
});
});
Nota: versioni prima di 1.0 utilizzate come segue:
$('select').trigger("liszt:updated");
Altri suggerimenti
La mia risposta è in ritardo, ma voglio aggiungere alcune informazioni che mancano in tutte le risposte sopra.
1) Se si desidera selezionare il valore singolo in selezione scelta.
$('#select-id').val("22").trigger('chosen:updated');
2) Se si utilizza più selezioni scelte, è possibile impostare più valori alla volta.
$('#documents').val(["22", "25", "27"]).trigger('chosen:updated');
Informazioni raccolte dai seguenti link:
1) Documenti scelti
2) Discussione GitHub scelta
A volte è necessario rimuovere le opzioni correnti per manipolare le opzioni selezionate.
Ecco un esempio come impostare le opzioni:
<select id="mySelectId" class="chosen-select" multiple="multiple">
<option value=""></option>
<option value="Argentina">Argentina</option>
<option value="Germany">Germany</option>
<option value="Greece">Greece</option>
<option value="Japan">Japan</option>
<option value="Thailand">Thailand</option>
</select>
<script>
activateChosen($('body'));
selectChosenOptions($('#mySelectId'), ['Argentina', 'Germany']);
function activateChosen($container, param) {
param = param || {};
$container.find('.chosen-select:visible').chosen(param);
$container.find('.chosen-select').trigger("chosen:updated");
}
function selectChosenOptions($select, values) {
$select.val(null); //delete current options
$select.val(values); //add new options
$select.trigger('chosen:updated');
}
</script>
Jsfiddle (comprese le opzioni di appendice Howto):https://jsfiddle.net/59x3m6op/1/
In caso di multiplo Tipo di selezione e/o se si desidera rimuovere gli elementi già selezionati uno per uno, direttamente all'interno di un elenco a discesa, è possibile utilizzare qualcosa di simile:
jQuery("body").on("click", ".result-selected", function() {
var locID = jQuery(this).attr('class').split('__').pop();
// I have a class name: class="result-selected locvalue__209"
var arrayCurrent = jQuery('#searchlocation').val();
var index = arrayCurrent.indexOf(locID);
if (index > -1) {
arrayCurrent.splice(index, 1);
}
jQuery('#searchlocation').val(arrayCurrent).trigger('chosen:updated');
});