Question

is it possible to use Ajax with ASP.NET MVC 2 to reload a user control, pass along a new Model and have it update all the values that make use of this model without refreshing the rest of the site content?

Answer 1

I got it working!

I have the following code in the Controller:

[Authorize, HttpPost]
public ActionResult UpdateDinner(FormCollection formValues)
{
  if (Request.IsAjaxRequest())
  {
    Dinner Dinner = DinnerRepository.GetDinner(Convert.ToInt32(formValues["Date"]));
    return PartialView("DeclaratieWidget", Dinner);
  }
}

I have this code in my View:

<script src="<%= AppPathHelper.Url(Request.ApplicationPath, "/Scripts/MicrosoftAjax.debug.js") %>" type="text/javascript"></script>
<script src="<%= AppPathHelper.Url(Request.ApplicationPath, "/Scripts/MicrosoftMvcAjax.debug.js") %>" type="text/javascript"></script>

<% using (Ajax.BeginForm("UpdateDinner", new AjaxOptions { UpdateTargetId = "Dinner" }))
  { %>
  <select id="Date" name="Date">
    <option value="<%= Dinner.Dinner_ID %>"><%= Dinner.Date.ToString("dddd d MMMM") %></option>
  </select>
  <input type="submit" value="Delete" />

<div id="avondeten">
  <% Html.RenderPartial("DeclaratieWidget", Model.Dinners[0]); %>
</div>

It works perfectly this way! 😀