Deaktivieren Sie die von jquery ausgewählte Dropdown-Liste

Ich habe ein ausgewähltes Div, das ich mit dem ausgewählten JQuery-Plugin verwende , um Funktionen zu formatieren und hinzuzufügen (insbesondere Suche). Der Div sieht ungefähr so ​​aus,

 <select data-placeholder="add a foobar" id="foobar" style="width: 350px;">
 <option value=""></option>
 </select>

Und ich benutze das gewählte Plugin so,

 $('#foobar').chosen();

Während einige AJAX geladen werden, möchte ich die gesamte <select>Div deaktivieren . Vielleicht mit so etwas,

 $('#foobar').disable()

oder dieses

 $('#foobar').prop('disabled', true)

Ich denke du kommst auf die Idee.

Irgendwelche Ideen, wie das geht? Ich habe eine Reihe verschiedener Dinge ausprobiert, z. B. die Verwendung von jquery-Redewendungen zum Deaktivieren von Dingen, das Deaktivieren der, <select>die nur die zugrunde liegende Auswahl deaktiviert, nicht die ausgewählten Dinge darüber. Ich habe sogar manuell ein weiteres Div mit einem High hinzugefügt z-index, um die Box nur grau zu machen, aber ich denke, dass dies wahrscheinlich hässlich und fehlerhaft ist.

Danke für die Hilfe!

Sie deaktivieren nur Ihr select, aber ausgewähltes rendert es als Divs, Spans usw. Nachdem Sie Ihr Select deaktiviert haben, müssen Sie das Plugin aktualisieren, damit das Select-Widget ebenfalls deaktiviert wird. Sie können dies folgendermaßen versuchen:

$('#foobar').prop('disabled', true).trigger("liszt:updated");

//For non-older versions of chosen you would want to do:

$('#foobar').prop('disabled', true).trigger("chosen:updated");

Ich habe die Informationen hier gefunden

Geige

Sobald Sie das Widget aktualisiert haben, wird lediglich der Klick oder andere Ereignisse im Plugin aufgehoben und die Deckkraft auf 0,5 geändert. Da es für einen Div keinen wirklich deaktivierten Zustand gibt.

In der letzten Version von gewählt, liszt:updatedfunktioniert nicht mehr. Sie müssen verwenden chosen:updated:

$(".chosen-select").attr('disabled', true).trigger("chosen:updated")

Hier ist eine JSFiddle .

PSL war korrekt, aber ausgewählt wurde seitdem aktualisiert.

Fügen Sie dies nach dem Deaktivieren ein:

$("#your-select").trigger("chosen:updated");

$('#foobar').prop('disabled', true).trigger("chosen:updated");

Das funktioniert perfekt !!!! @chosen v1.3.0

Sie können dies versuchen:

$("#foobar").prop('disabled',true).trigger("chosen:updated").chosen('destroy').chosen()

$("chosen_one").chosen({
  max_selected_options: -1
});

$(document).ready(function () {
    $("#foobar").chosen().on('chosen:showing_dropdown',function() {
            $('.chosen-select').attr('disabled', true).trigger('chosen:updated');
            $('.chosen-select').attr('disabled', false).trigger('chosen:updated');
            $('.search-choice-close').hide();
    });
    $('.search-choice-close').hide();
});