リストボックスの更新/リフレッシュトリガーを使用したドロップダウン選択（ "選択：更新"）

Question

ユーザーがドロップダウンリストでオプションを選択した後にリフレッシュする必要があるリストボックスがあります。

画像は自明です。 Listboxの部署 - departementのロードリストを選択すると、下のリストボックスにVat Rateのリフレッシュ/ロード率リストが選択されている場合、 （デフォルトの部門リストはページの読み込み時に読み込まれます）。私は現在trigger("chosen:updated")でこれを試しており、幸運なリストボックスはありません。その機能のための私のコードはここにあります。

$(function() { 
$("#SelectFilter").change(function() { 

    if (document.getElementById('SelectFilter').value == 1) //dropdownlist 
    { 
     //empty listbox   
     $('#SelectItems').empty(); 

     //append new list to listbox 
     $.each(data.Departments, function (index, element) { 
      $('#SelectItems').append('<option value="' + element.Value + '">' 
       + element.Text + '</option>'); 
     }); 

     //refresh 
     $('#SelectItems').trigger("chosen:updated"); 
    }  
    if (document.getElementById('SelectFilter').value == 2) 
    {    
     $('#SelectItems').empty(); 

     $.each(data.VatRates, function (index, element) { 
      $('#SelectItems').append('<option value="' + element.Value + '">' 
       + element.Text + '</option>'); 
     }); 

     $('#SelectItems').trigger("chosen:updated"); 
    } 
}); 

}）;

ドロップダウンリストから選択した値が問題ではないことを認識しても問題ありません。リストボックスは現在、新しい選択肢で更新/更新されていません。そして、私はこれで間違っているとわかりません。

Answer 1

リストを関数に作成するためのコードをすべて入れておき、選択したアイテムのうち1つを選択してイベントをバインドし、.trigger（）を使用する代わりに新しいリストを生成するこの関数を呼び出します。 HTML部分も提供すれば、すぐにサンプルコードを投稿します。

Answer 2

選択した値の認識に問題があるか、セカンダリセレクトタグを設定するか、データの初期読み込みに問題があるかどうかはわかりません。だから私は3つのステップの例を提供しています。

最初に、選択した値を検出するには、.change()ハンドラを指定し、選択した値を.val()で抽出する必要があります。これに似た何か：

$("#SelectFilter").change(function() { 
    var v = $(this).val(); 
    if (v=="value1") { 

    } else if (v=="value2") { 

    } else { 

    } 
}); 

その後、検出された変化のそれぞれは、二次selectタグ、このような単純なものの内容を更新する必要があります...

$("#SelectItems").empty(); 
    ['first item','second item','troisième'].forEach((v,i) => 
    $("#SelectItems").append($("<option>").val("item"+i).text(v)) 
); 
} 

そして最後に、最初のロードをトリガ私はこのフィドルhttps://jsfiddle.net/mud9u8yL/6/

ですべてのステップを一緒に入れている変更イベント

$("#SelectFilter").change(); 

をトリガするのと同じくらい簡単でなければなりません