title: partial view refresh not working after ajax call on a button click
body: <p>I have a partial view and and submitting form on a button click using ajax. After submitting I want to reload the partial view and show a success message. Ajax request is submitting correctly but I m unable to reload the partialview in the desired div with class <code>divPartial</code>. The partial view is loading on a separate page for some reasons. I do have jquery.unobtrusive-ajax.min.js on my layout page. I m just wondering if this is the best way to refresh the partial page and if so then why partial view is not loading in the correct container div.</p>
  
  <p>Below is my partial view code</p>
  
  <pre><code>&lt;div class="divPartial"&gt;
    @using (Html.BeginForm("UpdateRequest", "Request", FormMethod.Post, new { @class = "form", id = "RequestForm", enctype = "multipart/form-data" }))
    {
      @Html.ValidationSummary(true)
      &lt;div class="row"&gt;
        &lt;div class="form-group"&gt;
          &lt;div class="col-sm-2 control-label"&gt;
            @Html.LabelFor(model =&gt; model.RequestFrom, new { @class = "required" })
          &lt;/div&gt;
          &lt;div class="col-sm-4"&gt;
            @Html.TextBoxFor(model =&gt; model.RequestFrom, new { @class = "form-control required" })
            @Html.ValidationMessageFor(model =&gt; model.RequestFrom)
          &lt;/div&gt;
          &lt;div class="col-sm-1 control-label"&gt;
            @Html.LabelFor(model =&gt; model.RequestId)
          &lt;/div&gt;
          &lt;div class="col-sm-4"&gt;
            @Html.TextBoxFor(model =&gt; model.RequestId, new { @class = "form-control" })
            @Html.ValidationMessageFor(model =&gt; model.RequestId)
          &lt;/div&gt;
        &lt;/div&gt;
      &lt;/div&gt;
      @Html.HiddenFor(model =&gt; model.TimeStamp);
  
      &lt;div class="row"&gt;
        &lt;div class="form-group"&gt;
          &lt;div class="col-sm-5 control-label"&gt;
          &lt;/div&gt;
          &lt;div class="col-sm-6"&gt;
            &lt;input class="btn btn-danger pull-right" type="submit" id="btnUpdateRequest" value="Update" /&gt;&amp;nbsp;  
          &lt;/div&gt;
        &lt;/div&gt;
      &lt;/div&gt;
    }
  &lt;/div&gt;
  </code></pre>
  
  <p>The Ajax call is below</p>
  
  <pre><code>$(document).ready(function () {
    $('#btnUpdateRequest').click(function (e) {
    {
      $.ajax({
        url: '/request/UpdateRequest',
        data: $('#RequestForm').serializeArray(),
        type: 'POST',
        success: function (data) {                           
          $('.divPartial').html(data);                          
          $('#ResponseContainer').addClass('show').removeClass('hide');
        }
      });
    }
    });
  });
  </code></pre>
  
  <p>My Controller has the following code</p>
  
  <pre><code>[HttpPost]
  public PartialViewResult UpdateRequest(ChangeRequestModel changeRequestModel)
  {
    var model = changeRequestModel;
    ChangeRequest changeRequest = new ChangeRequest();
    changeRequest = model.ToDbEntity();
    this.unitOfWork.ChangeRequestModelRepository.Update(changeRequest);
  this.unitOfWork.ChangeRequestModelRepository.CommitApplicationEntities();
    return PartialView("_Request", changeRequestModel);     
  
  }
  </code></pre>