This example is contrived, I have a partial view that i load via ajax on a page. There is a dropdownlist on the partial view. If a I change the value of the dropdownlist and then in the controller i reset the value. When the partial view loads again(via ajax), the dropdownlist does not get the set value correctly.

Loading partial view:

```
@model Test_PartailViews.Models.MyItemViewModel
@{
    ViewBag.Title = "Home Page";
}

<div id="partialViewGoesHere">  
</div>

@section Scripts {
  @Scripts.Render("~/bundles/jqueryval")
<script>
 $(document).ready(function(){
      $.ajax({
        url: '/Home/GetForm',
        type: 'GET',         
        cache: false,
        success: function (result) {
          $('#partialViewGoesHere').html(result);
        },
        error: function (xhr, ajaxOptions, thrownError) {
          alert(xhr.status + ':' + thrownError);
        }
      });
 });
 </script>
}

```

Partial View with dropdownlist

```
@model Test_PartailViews.Models.MyItemViewModel

  @using (Html.BeginForm("SaveForm", "Home", FormMethod.Post, new { id = "HomeForm" }))
  {
    <fieldset>
      @Model.MyItemId
      <div class="row">      
        <div class="col-sm-4 editor-field">

          @Html.DropDownList("MyItemId", new SelectList(Model.ItemOptions, "Id", "Name", Model.MyItemId), "Select One...")
          @Html.ValidationMessageFor(model => model.MyItemId)

        </div>
      </div>
      <input type="submit" value="Submit" />
    </fieldset>
  }

<script type="text/javascript">

  $('#HomeForm').submit(function () {

    $.ajax({
      url: this.action,
      type: this.method,
      data: $(this).serialize(),
      cache: false,
      success: function (result) {
        // reload the partial view that is returned from post
        $('#HomeForm').parent().html(result);
      },
      error: function (xhr, ajaxOptions, thrownError) {
        // show error occured
        $('#HomeForm').parent().html(xhr.status + ':' + thrownError);
      }
    });

    // show loading image when ajax call is made
    $('#HomeForm').html('');

    return false;
  }); // $('form').submit

</script>

```

Controller:

```
public class HomeController : Controller
  {

    // Main page that has the partial view on it
    [HttpGet]
    public ActionResult Index()
    {
      MyItemViewModel model = new MyItemViewModel() { MyItemId = 1 };
      return View(model);
    }

    // return partial view
    [HttpGet]
    public ActionResult GetForm()
    {
      // reset the id to 1
      MyItemViewModel model = new MyItemViewModel() { MyItemId = 1 };
      return PartialView("_MyItemPV", model);
    }

    // save partial view data
    [HttpPost]
    public ActionResult SaveForm(MyItemViewModel youModel)
    { 
       return GetForm();
    }
}

```

Model:

```
public class MyItemViewModel
  {

    public int MyItemId { get; set; }

    public List<MyItem> ItemOptions {
      get
      {
        List<MyItem> lst = new List<MyItem>();
        lst.Add(new MyItem() { Id = 1, Name = "One" });
        lst.Add(new MyItem() { Id = 2, Name = "Two" });
        lst.Add(new MyItem() { Id = 3, Name = "Three" });
        return lst;
      }
    }

  }

  public class MyItem
  {
    public int Id { get; set; }
    public string Name { get; set; }
  }

```

When the screen loads it shows the Id is 1 and dropdownlist is "One" as expected
![initial page load](https://i.stack.imgur.com/jFbCF.png)

After changing the value to "Two" and clicking submit. I would expect the GetForm method to reset the model value to 1, and the dropdownlist to read "One" as well. However "Two" is selected, even though the Id is 1.
![Id is set to 1 but the dropdownlist has two selected](https://i.stack.imgur.com/7SpYq.png)

After viewing the result from fiddler, i can confirm that the partial view is returning the value "two" as selected".

Any help would be appreciated.