Deaktivieren Sie die von jquery ausgewählte Dropdown-Liste

86

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!

javascript jquery jquery-chosen Gideonit
quelle

147

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.

PSL
quelle

Sieht so aus, als ob ein Tippfehler vorliegt. Sollte liszt:updatedes nicht `list: aktualisiert sein?

Lanoxx

1

lisztwar richtig, aber jetzt chosen:updatedist der richtige Weg, es trotzdem zu tun.

Kaleb Anderson

Vorschlag: Möglicherweise müssen Sie in Ihrer Antwort zuerst die neueste Version des Codes angeben, da viele Benutzer die neueste Version verwenden. Ich habe verwendet liszt:updatedund nicht funktioniert, da es in neuen Versionen nicht funktioniert.

Glücklicher

.trigger("chosen:updated");Es dient auch zum Aktivieren oder Deaktivieren, beispielsweise wenn Sie es in einer Funktion erneut aufrufen.

Arenas V.

$ ('# foobar option: not (: selected)'). prop ('disabled', true) .trigger ("ausgewählt: aktualisiert"); deaktiviert die anderen Elemente in der Dropbox mit Ausnahme des ausgewählten Elements.

Asad Naeem

51

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 .

Orlando
quelle

7

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

Fügen Sie dies nach dem Deaktivieren ein:

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

Pavan Katepalli
quelle

6

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

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

user2877913
quelle

1

Sie können dies versuchen:

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

ruvi
quelle

0

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

Andrew Nodermann
quelle

0

$(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();
});

boateng
quelle

Deaktivieren Sie die von jquery ausgewählte Dropdown-Liste

Antworten:

Geige