title: How to reset the partial view containing cascading dropdown list in MVC4 Jquery
body: <p>I am using MVC4/EF and I have four cascading dropdownlist and I got it working the first time. So when the page is rendered first time, I am able to select the first dropdown and filter the result on the second and by selecting second dropdowm the third dropdwon is filtered and fourth and based on the fourth drop down I populate a edit view. But when I go back and change the selection in the first drop down, it is filtering the second drop down but not resetting the third, fourth dropdwon list and the edit partial view. Here is teh first dropdwon partial view  code.</p>
  
  <p>CampusUsercontrol.cshtml</p>
  
  <pre><code>@model RHMS.Models.RoomEditor
  @using (Ajax.BeginForm("SelectCampus", "RoomEditor", new AjaxOptions { UpdateTargetId  = "Buildings" }))
  { 
  @Html.DropDownListFor(
          m =&gt; m.SelectedCampusID,
          new SelectList(Model.Campuses,"CampusId", "Name"),
         string.Empty
      )
  }
  
  &lt;script type="text/javascript"&gt;
  
  $('#SelectedCampusID').change(function () {
      $(this).parents('form').submit();
  
   });
  &lt;/script&gt;
  </code></pre>
  
  <p>Index.cshtml</p>
  
  <pre><code> @model RHMS.Models.RoomEditor
   @{
  ViewBag.Title = "Index";
  Layout = "~/Views/Shared/_Layout.cshtml";
   }
     &lt;table cellpadding="0" cellspacing="4" border="0"&gt;
  &lt;tr&gt;
      &lt;td&gt;Campus &lt;/td&gt;
      &lt;td&gt; :&lt;/td&gt;
      &lt;td&gt;@Html.Partial("CampusUserControl", Model)&lt;/td&gt;
  &lt;/tr&gt;
  &lt;tr&gt;
      &lt;td&gt;Building &lt;/td&gt;
      &lt;td&gt; :&lt;/td&gt;
      &lt;td&gt;&lt;div id="Buildings"&gt;@Html.Partial("BuildingUserControl", Model)&lt;/div&gt;&lt;/td&gt;
  &lt;/tr&gt;
  &lt;tr&gt;
      &lt;td&gt;Floor &lt;/td&gt;
      &lt;td&gt; :&lt;/td&gt;
      &lt;td&gt;&lt;div id="Floor"&gt;@Html.Partial("FloorsUserControl", Model)&lt;/div&gt;&lt;/td&gt;
  &lt;/tr&gt;
   &lt;tr&gt;
      &lt;td&gt;Room &lt;/td&gt;
      &lt;td&gt; :&lt;/td&gt;
      &lt;td&gt;&lt;div id="Room"&gt;@Html.Partial("RoomUserControl", Model)&lt;/div&gt;&lt;/td&gt;
  &lt;/tr&gt;
  &lt;/table&gt;
  &lt;div id="RoomInfo"&gt;
  @Html.Partial("RoomInfoUserControl", Model)
  &lt;/div&gt;
  </code></pre>
  
  <p>Please help me how to refresh the other partial views when the first one is changed.</p>