title: Populating a dropdown based on selection in another dropdown in ASP.NET MVC 5
body: <p>hoping someone can point out where I am going wrong. I am working on an MVC 5 ASP.NET application. In my View I have a form which, amongst other controls, has 2 dropdown boxes.The first dropdown is populated with values in the Viewbag, but I want to populate the second dropdown based on the value selected in the first dropdown. I've read lots of other posts but still can't work it out.</p>
  
  <p>Here is the code for the dropdowns.</p>
  
  <pre><code>@Html.DropDownList("EquipmentPortList", new SelectList(ViewBag.EquipmentPortList, "hvid", "hvnamn"), "--Select Equipment--")
  
  @Html.DropDownList("PortConnectedList", Enumerable.Empty&lt;SelectListItem&gt;(), "--Select Port--")
  </code></pre>
  
  <p>Here is the change event code for the first dropdown :-</p>
  
  <pre><code>$(document).on('change', '#EquipmentPortList', function () {
      var url = '@Url.Action("GetPortInt", "bearers")';
      var ports = $('#PortConnectedList');
      var id = $(this).val();
  
      $.getJSON(url, { portid: id }, function (response) {
          ports.empty();
          $.each(response, function (index, item) {
              ports.append($('&lt;/option&gt;').text(item.portnamn).val(item.portid));
          });
      });
  });
  </code></pre>
  
  <p>Here is the method in the controller :-</p>
  
  <pre><code>public ActionResult GetPortInt(int portid)
  {
      var PortConnectedList = from h in nadb.hvportar
                              where h.porthvid == portid &amp;&amp; (h.portnamn.Contains("NT") || (h.portnamn.Contains("Port")) || (h.portnamn.Contains("/")))
                              orderby h.portid
                              select new { h.portid, h.portnamn };
  
      return Json(PortConnectedList, JsonRequestBehavior.AllowGet);
  }
  </code></pre>
  
  <p>OK, so the first dropdown populates correctly, and when I select a value I can see (using alerts) that the change event fires and the value is correctly selected. </p>
  
  <p>I can see with the use of a breakpoint that the method is triggered and returns the correct data from the database, but after that I don't know what is wrong as the dropdown does not populate.</p>
  
  <p>I picked up the code change event code from another post and amended it to fit my own project but I can't see what I'm missing. Thanks. </p>