JQuery-Dropdown-Liste löschen und aktualisieren

Ich versuche, die ausgewählte Dropdown-Liste von jQuery zu löschen und zu aktualisieren.

HTML:

<select data-placeholder="Select Picture..." class="chosen-select" style="width:250px;" id="picturegallery" tabindex="2">
    <option value="" selected="selected"></option>
    <option value="x">remove me</option>
</select>

Wenn ich auf "Aktualisieren" klicke, sollte dies folgendermaßen aussehen:

<select data-placeholder="Select Picture..." class="chosen-select" style="width:250px;" id="picturegallery" tabindex="2">
    <option value="1">test</option>
</select>

Was ich versucht habe:

$("#refreshgallery").click(function(){
    $('#picturegallery').empty();
    var newOption = $('<option value="1">test</option>');
    $('#picturegallery').append(newOption);
});

Aber ich kann es nicht dazu bringen, diese Dropdown-Liste zu aktualisieren ... Hilfe? :) :)

Mit können .trigger("chosen:updated");Sie die Optionsliste nach dem Anhängen aktualisieren.

Dynamisch aktualisieren : Wenn Sie die Optionen in Ihrem Auswahlfeld aktualisieren müssen und möchten, dass Chosen die Änderungen übernimmt, müssen Sie das Ereignis "Ausgewählt: Aktualisiert" im Feld auslösen. Ausgewählt wird sich basierend auf dem aktualisierten Inhalt neu erstellen.

Dein Code:

$("#refreshgallery").click(function(){
        $('#picturegallery').empty(); //remove all child nodes
        var newOption = $('<option value="1">test</option>');
        $('#picturegallery').append(newOption);
        $('#picturegallery').trigger("chosen:updated");
    });

Wenn es trigger("chosen:updated");nicht funktioniert, verwenden Sie .trigger("liszt:updated");@Nhan Tran, es funktioniert einwandfrei.

$("#idofBtn").click(function(){
        $('#idofdropdown').empty(); //remove all child nodes
        var newOption = $('<option value="1">test</option>');
        $('#idofdropdown').append(newOption);
        $('#idofdropdown').trigger("chosen:updated");
    });

MVC 4:

    function Cargar_BS(bs) {
        $.getJSON('@Url.Action("GetBienServicio", "MonitoreoAdministracion")',
                        {
                            id: bs
                        },
                        function (d) {
                            $("#txtIdItem").empty().append('<option value="">-Seleccione-</option>');
                            $.each(d, function (idx, item) {
                                jQuery("<option/>").text(item.C_DescBs).attr("value", item.C_CodBs).appendTo("#txtIdItem");
                            })
                            $('#txtIdItem').trigger("chosen:updated");
                        });
    }

In meinem Fall muss ich den ausgewählten Wert bei jeder Änderung aktualisieren, da beim Senden des Formulars immer falsche Werte angezeigt werden und ich mehrere ausgewählte Dropdown-Listen verwendet habe. Anstatt einzelne Einträge zu aktualisieren, ändern Sie die Auswahl, um alle Dropdown-Listen zu aktualisieren. Dies könnte jemandem helfen

 $(".chosen-select").chosen().change(function () {
    var item = $(this).val();
    $('.chosen-select').trigger('chosen:updated');
});

Wenn für den Fall trigger("chosen:updated");nicht für Sie funktioniert. Sie können versuchen, $('#ddl').trigger('change');wie in meinem Fall seine Arbeit für mich.