title: ASP.NET MVC return 500 for dropdownlist cascading
body: <p><strong>Am using it for cascading dropdownlist for country and state. When I click on
  country dropdownlist that suppose to display states, I got 500 server error. Please help me</strong></p>
  
  <blockquote>
    <p>The error occurs when I click the Country dropdownlist</p>
  </blockquote>
  
  <pre><code>        [HttpPost]
      [ValidateAntiForgeryToken] //this is to prevent CSRF attack
      public ActionResult Create(CITIES ci)
      {
          List&lt;COUNTRIES&gt; allCountry = new List&lt;COUNTRIES&gt;();
          List&lt;STATES&gt; allState = new List&lt;STATES&gt;();
          using (AdminEntities dc = new AdminEntities())
          {
              allCountry = dc.COUNTRIES.OrderBy(a =&gt; a.COUNTRY_NAME).ToList();
              if (ci != null &amp;&amp; ci.COUNTRY_ID &gt; 0)
              {
                  allState = dc.STATES.Where(a =&gt; a.COUNTRY_ID.Equals(ci.COUNTRY_ID)).OrderBy(a =&gt; a.STATE_NAME).ToList();
              }
          }
          ViewBag.COUNTRY_ID = new SelectList(allCountry, "COUNTRY_ID", "COUNTRY_NAME", ci.COUNTRY_ID);
          ViewBag.STATE_ID = new SelectList(allState, "STATE_ID", "STATE_NAME", ci.STATE_ID);
  
  
          if (ModelState.IsValid)
          {
              using (AdminEntities dc = new AdminEntities())
              {
                   dc.CITIES.Add(ci);
                   dc.SaveChanges();
                   ModelState.Clear();
                   ci = null;
                   ViewBag.Message = "Successfully Saved";
              }
          }
          else
          {
              ViewBag.Message = "Failed! Please try again";
          }
          return View(ci);
      }
  
          [HttpGet]
      public JsonResult GetStates(string countryID = "")
      {
         // List&lt;COUNTRIES&gt; allCountry = new List&lt;COUNTRIES&gt;();
          List&lt;STATES&gt; allState = new List&lt;STATES&gt;();
          int ID = 0;
          if (int.TryParse(countryID, out ID))
          {
              using (AdminEntities dc = new AdminEntities())
              {
                  allState = dc.STATES.Where(a =&gt; a.COUNTRY_ID.Equals(ID)).OrderBy(a =&gt; a.STATE_NAME).ToList();
              }
          }
          if (Request.IsAjaxRequest())
          {
              return new JsonResult
              {
                  Data = allState,
                  JsonRequestBehavior = JsonRequestBehavior.AllowGet
              };
          }
          else
          {
              return new JsonResult
              {
                  Data = "Not valid request",
                  JsonRequestBehavior = JsonRequestBehavior.AllowGet
              };
          }
      }
  </code></pre>
  
  <p><strong>view</strong></p>
  
  <pre><code>@model BPP.CCSP.Admin.Web.Models.CITIES
  </code></pre>
  
  <h2>Create</h2>
  
  <pre><code>@Html.AntiForgeryToken()
  @Html.ValidationSummary(true)
  
  &lt;div class="form-horizontal"&gt;
      &lt;h4&gt;CITIES&lt;/h4&gt;
      &lt;hr /&gt;
  
  
      @if(ViewBag.message != true)
      {
          &lt;div style="border:solid 1px black"&gt;
              @ViewBag.message
          &lt;/div&gt;
      }
      &lt;div class="form-group"&gt;
          @Html.LabelFor(model =&gt; model.COUNTRY_ID, "COUNTRY_ID", new { @class = "control-label col-md-2" })
          &lt;div class="col-md-10"&gt;
           @*    @Html.DropDownListFor(model=&gt;model.COUNTRY_ID, new SelectList(string.Empty, "Value", "Text"), "Please select a country", new { @style = "width:250px;" }) *@
              @Html.DropDownListFor(model =&gt; model.COUNTRY_ID, @ViewBag.COUNTRY_ID as SelectList,"Select Country") 
              @Html.ValidationMessageFor(model =&gt; model.COUNTRY_ID)
          &lt;/div&gt;
      &lt;/div&gt;
  
      &lt;div class="form-group"&gt;
          @Html.LabelFor(model =&gt; model.STATE_ID, "STATE_ID", new { @class = "control-label col-md-2" })
          &lt;div class="col-md-10"&gt;
           @*    @Html.DropDownListFor(model =&gt; model.STATE_ID, new SelectList(string.Empty, "Value", "Text"), "Please select a state", new { @style = "width:250px;" }) *@
             @Html.DropDownListFor(model =&gt; model.STATE_ID, @ViewBag.STATE_ID as SelectList, "Select State")  
                  @Html.ValidationMessageFor(model =&gt; model.STATE_ID)
              &lt;/div&gt;
          &lt;/div&gt;
  
          &lt;div class="form-group"&gt;
              @Html.LabelFor(model =&gt; model.CITY_NAME, new { @class = "control-label col-md-2" })
              &lt;div class="col-md-10"&gt;
                  @Html.EditorFor(model =&gt; model.CITY_NAME)
                  @Html.ValidationMessageFor(model =&gt; model.CITY_NAME)
              &lt;/div&gt;
          &lt;/div&gt;
  
          &lt;div class="form-group"&gt;
              &lt;div class="col-md-offset-2 col-md-10"&gt;
                  &lt;input type="submit" value="Create" class="btn btn-default" /&gt;
              &lt;/div&gt;
          &lt;/div&gt;
      &lt;/div&gt;
  }
  
  &lt;div&gt;
      @Html.ActionLink("Back to List", "Index")
  &lt;/div&gt;
  
  @section Scripts {
      @Scripts.Render("~/bundles/jqueryval")
      &lt;script language="javascript"&gt;
          $(document).ready(function () {
              $("#COUNTRY_ID").change(function () {
                  //this will call when country dropdown select change
                  var countryID = parseInt($("#COUNTRY_ID").val());
                  if (!isNaN(countryID))
                  {
                      var ddState = $("#STATE_ID");
                      ddState.empty(); //this line is to clear all items from statee dropdown
                      ddState.append($("&lt;option&gt;&lt;/option&gt;").val("").html("Select State"));
  
                      //here i will call controller action via jquery to load state for selected country
                      $.ajax({
                          url: "@Url.Action("GetStates","CITIES")",
                          type: "GET",
                          data: {countryID : countryID},
                          dataType: "json",
                          success: function (data)
                          {
                              $.each(data, function (i, val) {
                                  ddState.append(
                                      $("&lt;option&gt;&lt;/option&gt;").val(val.STATE_ID).html(val.STATE_NAME)
                                      );
                              });
                          }
                          ,
                          error: function ()
                          {
                              alert("Error!");
                          }
                      });
  
                  }
              });
          });
      &lt;/script&gt;
  
  }
  </code></pre>
  
  <p><strong>Please what do I do</strong></p>