title: Refresh partial view content when submit button clicked
body: <p>I have a strongly typed view, which has a form in which I put one field showtime when the submit button is clicked I want to save the entry into database also display that entry along with other entries on the database inside the  partial view I put on the main view . When the Index action method is called the Main view is rendered .I want to update the Partial view when a new entry is saved without reloading the whole page ,just refresh the partial page.</p>
  
  <p>Here is my view :</p>
  
  <pre><code>@model Bookmany.Admin.Models.Theater.TheaterShowTimeViewModel
  
  @{
      ViewBag.Title = "Theater showTimes / BookMany";
   }
  
  &lt;h3&gt;Theater ShowTimes&lt;/h3&gt;
   @using (Html.BeginForm())
   {
  @Html.AntiForgeryToken()
  
  &lt;div class="form-horizontal"&gt;
  
      &lt;hr /&gt;
      @Html.ValidationSummary(true)
  
      &lt;div class="form-group"&gt;
          @Html.LabelFor(model =&gt; model.TheaterID, new { @class = "control-label col-md-2" })
          &lt;div class="col-md-10"&gt;
              @Html.DropDownListFor(model =&gt; model.TheaterID, Model.AvailableTheaters)
              @Html.ValidationMessageFor(model =&gt; model.TheaterID)
          &lt;/div&gt;
      &lt;/div&gt;
  
      &lt;div class="form-group"&gt;
          @Html.LabelFor(model =&gt; model.ShowTimeName, new { @class = "control-label col-md-2" })
          &lt;div class="col-md-10"&gt;
              @Html.EditorFor(model =&gt; model.ShowTimeName)
              @Html.ValidationMessageFor(model =&gt; model.ShowTimeName)
          &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="Save" class="btn btn-default" /&gt;
          &lt;/div&gt;
      &lt;/div&gt;
  &lt;/div&gt;
  }
  
  &lt;div&gt;
    @Html.Partial("_TheaterShowTimeList", Model.TheaterShowTimeList)
  &lt;/div&gt;
  </code></pre>
  
  <p>Here is my partial view :</p>
  
  <pre><code>@model IEnumerable&lt;Bookmany.Core.Domain.TheaterShowTime&gt;
  
  &lt;table class="table"&gt;
  &lt;tr&gt;
      &lt;th&gt;
          Theater Name
      &lt;/th&gt;
      &lt;th&gt;
          @Html.DisplayNameFor(model =&gt; model.ShowTimeName)
      &lt;/th&gt;
      &lt;th&gt;&lt;/th&gt;
  &lt;/tr&gt;
  
  @foreach (var item in Model)
  {
      &lt;tr&gt;
          &lt;td&gt;
              @Html.DisplayFor(modelItem =&gt; item.Theater.TheaterName)
          &lt;/td&gt;
          &lt;td&gt;
              @Html.ActionLink("Edit", "Edit", new { id = item.TheaterShowTimeID }) |
              @Html.ActionLink("Details", "Details", new { id = item.TheaterShowTimeID }) |
              @Html.ActionLink("Delete", "Delete", new { id = item.TheaterShowTimeID })
          &lt;/td&gt;
      &lt;/tr&gt;
  }
  </code></pre>
  
  <p></p>
  
  <p>My action method :</p>
  
  <pre><code>    public ActionResult Index()
      {
          var model = new TheaterShowTimeViewModel();
  
          //Bind Theater dropdown with selected value
          model.AvailableTheaters = GetTheaters();
          model.TheaterShowTimeList = _theaterShowTimeService.GetAllTheaterShowTime();
          return View(model);
  
      }
  
      [HttpPost]
      public ActionResult Index(TheaterShowTimeViewModel model)
      {
          if (ModelState.IsValid)
          {
              InsertOrUpdateTheaterShowTime(model);
              model.TheaterShowTimeList=_theaterShowTimeService.GetAllTheaterShowTime();
              return PartialView("_TheaterShowTimeList", model.TheaterShowTimeList);
          }
          return View(model);
      }
  </code></pre>
  
  <p>my problems :</p>
  
  <p>when I enter one value in the field and submit the form ,the entry saved now the partial view is only returned with the updated list </p>
  
  <p>I want to update the partial view without reloading the whole page how do achieve that?</p>