title: Cascading dropdownlist based on selection in Multi select list in asp.net MVC
body: <p>I have a multi select list </p>
  
  <pre><code>                    &lt;div id="statusWrapper" class="row" style="left:2px"&gt;
                           @Html.LabelFor(model =&gt; model.Countries, htmlAttributes: new { @class = "col-sm-4 label-box required" })
                           &lt;div class="col-md-6 input-group" style="left:2px; width: 47%;"&gt;
                               @Html.ListBoxFor(model =&gt; model.SelectedCountryIds, (MultiSelectList)Model.Countries, new { @class = "multiselect form-control", multiple = "multiple", id = "cbJT" })
                           &lt;/div&gt;
                   &lt;/div&gt;
                   &lt;div class="row" style="padding:2px"&gt;
                       @Html.Label("City", new { @class = "col-sm-4 label-box required" })
                       &lt;div class="col-sm-6 value-box" style="padding-left:2px; padding-top: 2px;"&gt;
                           @Html.DropDownListFor(model =&gt; model.CityId, Enumerable.Empty&lt;SelectListItem&gt;(), "Select", new { @class = "combobox form-control"})
                           @Html.ValidationMessageFor(x =&gt; x.CityId)
                       &lt;/div&gt;
                   &lt;/div&gt;
  </code></pre>
  
  <p>The first is a multiselect dropdown that gets populated on page load. Second drop down is dynamically populated whenever there is a selection (or deselection) in the previous list.</p>
  
  <pre><code> $('#cbJT').on('change', function (e) {
              $('#CityId').empty();
              $.each(this.selectedOptions, function (id, opt) {
                  $('&lt;option&gt;').val(opt.value).text(opt.text).appendTo('#CityId');
              });
   );
  </code></pre>
  
  <p>This successfully appends to the select tag, but drop down list is unable to expand, like it is empty, even though after a few selections, it holds values of a few countries.</p>
  
  <p>And the generated HTML after a few selections:
  <a href="https://i.stack.imgur.com/bIRAm.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/bIRAm.png" alt="enter image description here"></a></p>